var JielongCNY = function(){};

//static constant
JielongCNY.backendURL = null;
JielongCNY.GREETING_LIST_COUNT = 100;
JielongCNY.MARGIN = 10;

JielongCNY.jielongApp = null;
JielongCNY.embed = function(container,minWidth,minHeight)
{
	if(!document.createElement('canvas').getContext)
	{
		alert("Your browser doesn't support html5!");
		return;
	}
	
	var jielongApp = new JielongCNY();
	jielongApp.appContainer = document.getElementById(container);
	jielongApp.minWidth = minWidth;
	jielongApp.minHeight = minHeight;
	jielongApp.initialize();
	
	JielongCNY.jielongApp = jielongApp;
}

/** Instance property declare **/
JielongCNY.prototype.minWidth = 0;
JielongCNY.prototype.minHeight = 0;
JielongCNY.prototype.appWidth = 0;
JielongCNY.prototype.appHeight = 0;

JielongCNY.prototype.gid = 0;
JielongCNY.prototype.hasGid = false;

JielongCNY.prototype.greetings = null;

JielongCNY.prototype.appContainer = null;
JielongCNY.prototype.popupContainer = null;
JielongCNY.prototype.popupWrap = null;
JielongCNY.prototype.disableMask = null;
JielongCNY.prototype.disableCanvas = null;
JielongCNY.prototype.viewContiner = null;
JielongCNY.prototype.viewWrap = null;

JielongCNY.prototype.indexView = null;
JielongCNY.prototype.loadingView = null;
JielongCNY.prototype.greetingView = null;
JielongCNY.prototype.bottomView = null;

JielongCNY.prototype.player = null;
JielongCNY.prototype.bubblePlayer = null;

JielongCNY.prototype.userInfo = null;
JielongCNY.prototype.popupView = null;
JielongCNY.prototype.popupController = null;

JielongCNY.prototype.isMute = false;


JielongCNY.prototype.playMouseOver = function()
{
	if(this.isMute)
		return;
			
	this.bubblePlayer.play();
}

/** initialize game app **/
JielongCNY.prototype.initialize = function()
{
	// has gid or not?
	if(window.location.hash.length > 0)
	{
		var query = window.location.hash.split("#gid=");
		if(query.length > 1)
		{
			this.gid = query[1];
			this.hasGid = true;
		}else{
			this.hasGid = false;
		}
	}
	
	
	var bubblePlayer = document.createElement("audio");
	this.bubblePlayer = bubblePlayer;
	var source = document.createElement("source");
	source.src = "audio/roll_over.mp3";
	source.type = "audio/mp3";
	bubblePlayer.appendChild(source);
	var source = document.createElement("source");
	source.src = "audio/roll_over.ogg";
	source.type = "audio/ogg";
	bubblePlayer.appendChild(source);
	
	
	// build sound player.	
	var player = document.createElement("audio");
	this.player = player;
	var source2 = document.createElement("source");
	source2.src = "audio/my_song.mp3";
	source2.type = "audio/mp3";
	this.player.appendChild(source2);
	var source2 = document.createElement("source");
	source2.src = "audio/my_song.ogg";
	source2.type = "audio/ogg";
	this.player.appendChild(source2);
	this.player.play();
	this.player.addEventListener("ended",function(){player.play()});
	
	
	// build view structure.
	
	if(this.minWidth  > window.innerWidth)
		document.body.style.overflowX = "auto";
	else
		document.body.style.overflowX = "hidden";
	
	if(this.minHeight  > window.innerHeight)
		document.body.style.overflowY = "auto";
	else
		document.body.style.overflowY = "hidden";
	
	this.appWidth = Math.max(this.minWidth,window.innerWidth) - JielongCNY.MARGIN * 2;
	this.appHeight = Math.max(this.minHeight,window.innerHeight) - JielongCNY.MARGIN * 2;

	this.appContainer.style.width = this.appWidth + "px";
	this.appContainer.style.height = this.appHeight + "px";
	this.appContainer.style.margin = JielongCNY.MARGIN + "px";
	this.appContainer.style.position = "relative";
	
	this.viewWrap = document.createElement("div");
	this.viewWrap.style.width = this.appWidth + "px";
	this.viewWrap.style.height = this.appHeight + "px";
	this.viewWrap.style.position = "absolute";
	this.viewWrap.style.left = "0px";
	this.viewWrap.style.top = "0px";
	this.viewWrap.style.overflow = "hidden";
	this.appContainer.appendChild(this.viewWrap);
	
	this.viewContainer = document.createElement("div");
	this.viewContainer.style.width = this.appWidth + "px";
	this.viewContainer.style.height = this.appHeight + "px";
	this.viewContainer.style.position = "relative";
	this.viewWrap.appendChild(this.viewContainer);
	
	this.disableMask = document.createElement("div");
	this.disableMask.style.width = this.appWidth + JielongCNY.MARGIN * 2 + "px";
	this.disableMask.style.height = this.appHeight + JielongCNY.MARGIN * 2 + "px";
	this.disableMask.style.position = "absolute";
	this.disableMask.style.top = (-1 * JielongCNY.MARGIN) + "px";
	this.disableMask.style.left = (-1 * JielongCNY.MARGIN)  + "px";
	this.appContainer.appendChild(this.disableMask);
	this.disableMask.style.display = "none";
	
	var canvas = document.createElement("canvas");
	canvas.width = this.appWidth + JielongCNY.MARGIN * 2;
	canvas.height = this.appHeight + JielongCNY.MARGIN * 2;
	this.disableMask.appendChild(canvas);
	this.disableCanvas = canvas;
	
	var context = canvas.getContext("2d");
	context.fillStyle = "#000000";
	context.globalAlpha = 0.75;
	context.fillRect(0,0,this.appWidth + JielongCNY.MARGIN * 2,this.appHeight + JielongCNY.MARGIN * 2);
	
	this.popupWrap = document.createElement("div");
	this.popupWrap.style.width = this.appWidth + "px";
	this.popupWrap.style.height = this.appHeight + "px";
	this.popupWrap.style.position = "absolute";
	this.popupWrap.style.left = "0px";
	this.popupWrap.style.top = "0px";
	this.popupWrap.style.overflow = "hidden";
	this.appContainer.appendChild(this.popupWrap);
	this.popupWrap.style.display = "none"
	
	this.popupContainer = document.createElement("div");
	this.popupContainer.style.width = this.appWidth + "px";
	this.popupContainer.style.height = this.appHeight + "px";
	this.popupContainer.style.position = "relative";
	this.popupWrap.appendChild(this.popupContainer);
	
	// index view.
	this.indexView = new IndexViewController;
	this.indexView.initialize(this.appWidth,this.appHeight);
	this.viewContainer.appendChild(this.indexView.view);
	
	window.onresize = function(){JielongCNY.jielongApp.onResize()};
	
}


JielongCNY.prototype.indexViewPrepared = function()
{
	this.viewContainer.removeChild(this.indexView.view);
	this.indexView = null;
	IndexViewController.indexController = null;
	
	// add loading view.
	this.loadingView = new LoadingViewController;
	this.loadingView.initialize(this.appWidth,this.appHeight);
	this.viewContainer.appendChild(this.loadingView.view);
	

	// load user infomation.
	$.get(JielongCNY.backendURL + "get_userinfo.php",
		  function(data){JielongCNY.jielongApp.onUserInfoLoaded(data);},
		  "json");
}


// data load methods.

// on user info loaded.
JielongCNY.prototype.onUserInfoLoaded = function(data)
{
	if(data["error"] == null || data["error"] == 0) 
		this.userInfo = data;
	else
		this.userInfo = null;
	
	$.get(JielongCNY.backendURL + "get_greeting_list.php",
		  {count:JielongCNY.GREETING_LIST_COUNT},
		  function(data){JielongCNY.jielongApp.onGreetingListLoaded(data);},
		  "json");
}

JielongCNY.prototype.onGreetingListLoaded = function(data)
{
	if(this.loadingView != null)
	{
		this.loadingView.showFinal();
		var self = this;
		setTimeout(function()
			{
				self.viewContainer.removeChild(self.loadingView.view);
				self.loadingView = null;
				self.onGreetingListLoaded(data);
			},1000);
		return;
	}

	if(data.error == null)
	{
		this.greetings = data;
		this.greetingListView();
		if(this.hasGid)
		{
		  $.get(JielongCNY.backendURL + "view_greeting_by_id.php",
		  {id:this.gid},
		  function(data){JielongCNY.jielongApp.greetingIdLoaded(data);},
		  "json");	
		}
		
		this.bottomView = new BottomViewController();
		this.bottomView.initialize(this.appWidth,this.appHeight,this.greetings);
		this.viewContainer.appendChild(this.bottomView.view);
	}else{
		// hide loading view and show error message!
	}
}

JielongCNY.prototype.greetingListView = function()
{
	//add greeting view.
	this.greetingView  = new GreetingViewController();
	this.greetingView.initialize(this.greetings,this.appWidth,this.appHeight);
	this.viewContainer.appendChild(this.greetingView.view);
}

JielongCNY.prototype.greetingIdLoaded = function(data)
{
	if(data.error == null)
	{
		this.showGreeting(data);
	}
}

JielongCNY.prototype.popup = function(view)
{
	if(this.popupView != null)
		this.popupContainer.removeChild(this.popupView);

	this.popupView = view;
	this.popupWrap.style.display = "block";
	this.disableMask.style.display = "block";
	this.popupContainer.appendChild(view);
	
	view.style.left = this.appWidth / 2 - view.clientWidth / 2 + "px";
	view.style.top = this.appHeight / 2 - view.clientHeight / 2 + "px";
	
	if(this.greetingView != null)
		this.greetingView.stop();
}


JielongCNY.prototype.removePopup = function()
{
	var tempView = this.popupView;
	if(this.popupView != null)
		this.popupContainer.removeChild(this.popupView);
	
	if(this.popupController  != null)
		this.popupController = null;
	
	this.popupView = null;
	
	this.popupWrap.style.display = "none";
	this.disableMask.style.display = "none";
	
	if(this.greetingView != null)
		this.greetingView.resume();
	
	return tempView;
}

JielongCNY.prototype.showGreeting = function(greeting,matrixIndex)
{
	matrixIndex = matrixIndex == null ? matrixIndex : Math.floor(Math.random() * GreetingItem.MATRIXES.length);
	var greetingView = new GreetingView(greeting,matrixIndex,this.appWidth,this.appHeight);
	
	greetingView.view.style['opacity'] = 0;
	greetingView.view.style['-moz-opacity'] = 0;
	if(greetingView.view.filters) greetingView.view.filters.alpha['opacity'] = 0;
	
	var opacityTween = new OpacityTween(greetingView.view,Tween.strongEaseInOut, 0, 100, 2);
	opacityTween.start(); 
	
	this.popup(greetingView.view);
	this.popupController = greetingView;
}


// log in.
JielongCNY.prototype.login = function(greeting)
{
	var loginView = new LoginView(greeting);
	this.popup(loginView.view);
}

// log in complete
JielongCNY.prototype.loginComplete = function(userInfo)
{
	var loginView = this.removePopup();
	this.userInfo = userInfo;
	this.selectFriend(loginView.greeting);	
}

// send greeting.
JielongCNY.prototype.selectFriend = function(greeting)
{
	//select friends.	
	var friendView = new FriendsView;
	friendView.initialize();
	friendView.greeting = greeting;
	this.popup(friendView.view);
}

JielongCNY.prototype.sendGreeting = function(friends,greeting)
{
	var sendView = new SendView(friends,greeting);
	this.popup(sendView.view);
}



// on browser resized.
JielongCNY.prototype.onResize = function()
{
	if(this.bottomView != null)
		this.bottomView.hide();

	if(this.minWidth  > window.innerWidth)
		document.body.style.overflowX = "auto";
	else
		document.body.style.overflowX = "hidden";
	
	if(this.minHeight  > window.innerHeight)
		document.body.style.overflowY = "auto";
	else
		document.body.style.overflowY = "hidden";
	
	var appWidth = Math.max(this.minWidth,window.innerWidth) - JielongCNY.MARGIN * 2;
	var appHeight = Math.max(this.minHeight,window.innerHeight) - JielongCNY.MARGIN * 2;

	if(this.appWidth == appWidth && this.appHeight == appHeight)
		return;
		
	this.appWidth = appWidth;
	this.appHeight = appHeight;

	this.appContainer.style.width = this.appWidth + "px";
	this.appContainer.style.height = this.appHeight + "px";
	this.appContainer.style.margin = JielongCNY.MARGIN + "px";
	this.appContainer.style.position = "relative";
	
	this.viewWrap.style.width = this.appWidth + "px";
	this.viewWrap.style.height = this.appHeight + "px";

	this.viewContainer.style.width = this.appWidth + "px";
	this.viewContainer.style.height = this.appHeight + "px";

	this.disableMask.style.width = this.appWidth + JielongCNY.MARGIN * 2 + "px";
	this.disableMask.style.height = this.appHeight + JielongCNY.MARGIN * 2 + "px";

	this.disableCanvas.width = this.appWidth + JielongCNY.MARGIN * 2;
	this.disableCanvas.height = this.appHeight + JielongCNY.MARGIN * 2;
	
	var context = this.disableCanvas.getContext("2d");
	context.fillStyle = "#000000";
	context.globalAlpha = 0.75;
	context.fillRect(0,0,this.appWidth + JielongCNY.MARGIN * 2,this.appHeight + JielongCNY.MARGIN * 2);

	this.popupWrap.style.width = this.appWidth + "px";
	this.popupWrap.style.height = this.appHeight + "px";

	this.popupContainer.style.width = this.appWidth + "px";
	this.popupContainer.style.height = this.appHeight + "px";	
	
	if(this.indexView != null && this.indexView.resize != null)
		this.indexView.resize(this.appWidth,this.appHeight);
	
	if(this.bottomView != null && this.bottomView.resize != null)
		this.bottomView.resize(this.appWidth,this.appHeight);
	
	if(this.greetingView != null && this.greetingView.resize != null)
		this.greetingView.resize(this.appWidth,this.appHeight);
		
	if(this.popupView != null)
	{
		if(this.popupController != null && this.popupController.resize != null)
			this.popupController.resize(this.appWidth,this.appHeight);
	
		this.popupView .style.left = this.appWidth / 2 - this.popupView .clientWidth / 2 + "px";
		this.popupView .style.top = this.appHeight / 2 - this.popupView .clientHeight / 2 + "px";
	}
}

//index View
var IndexViewController = function(){};

IndexViewController.indexController = null;

IndexViewController.prototype.view = null;

IndexViewController.prototype.initialize = function(width,height)
{
	IndexViewController.indexController = this;

	this.view = document.createElement("img");
	this.view.style.width = 266 + "px";
	this.view.style.height = 35 + "px";
	this.view.style.position = "absolute";
	this.view.style.left = (width - 266) / 2 + "px";
	this.view.style.top = (height - 35) / 2 + "px";
	
	var indexBG = new Image;
	indexBG.src = "images/cny_loading.gif";
	indexBG.onload = function(){IndexViewController.indexController.prepared();};
}

IndexViewController.prototype.prepared = function()
{
	this.view.src = "images/cny_loading.gif";
	setTimeout(function(){JielongCNY.jielongApp.indexViewPrepared()},3000);
}

IndexViewController.prototype.resize = function(width,height)
{
	this.view.style.position = "absolute";
	this.view.style.left = (width - 266) / 2 + "px";
	this.view.style.top = (height - 35) / 2 + "px";
}

var FontManager = function(){};
FontManager.getFillFont = function(fontSize)
{
	var fontPattern;
	if(navigator.userAgent.indexOf("Firefox")>0)
		fontPattern = "bold {$fontSize}px 'STHeiti','黑体','STSong','宋体','STKaiti','楷体'";
	else
		fontPattern = "bold {$fontSize}px 'STHeiti','黑体','STSong','宋体','STKaiti','楷体'";
	
	return fontPattern.replace("{$fontSize}",fontSize);
}

FontManager.getNormalFont = function()
{
	return 'STHeiti','黑体','STSong','宋体','STKaiti','楷体';
}

//loading View.
var LoadingViewController  = function(){};

LoadingViewController.LINE_SPACE = 10;

LoadingViewController.loadingView = null;
LoadingViewController.prototype.view = null;
LoadingViewController.prototype.width = 0;
LoadingViewController.prototype.height = 0;

LoadingViewController.prototype.loadingImage = null;

LoadingViewController.prototype.initialize = function(width,height)
{
	IndexViewController.loadingView = this;
	
	this.view = document.createElement("div");
	this.view.style.position = "relative";
	this.view.style.width = width + "px";
	this.view.style.height = height + "px";
	
	this.loadingImage = document.createElement("img");
	this.loadingImage.src = "images/cny_loading.gif";
	this.loadingImage.width = 266;
	this.loadingImage.height = 35;
	this.loadingImage.style.position = "absolute";
	this.view.appendChild(this.loadingImage);
	
	var finalImg = new Image;
	finalImg.src = "images/cny_loading_final.jpg";
	
	this.resize(width,height);
}

LoadingViewController.prototype.resize = function(width,height)
{
	this.width = width;
	this.height = height;
	
	this.view.style.width = width + "px";
	this.view.style.height = height + "px";
	
	this.loadingImage.style.left = (width - 266) / 2 + "px";
	this.loadingImage.style.top = (height - 35) / 2 + "px";
}

LoadingViewController.prototype.showFinal = function()
{
	this.loadingImage.src = "images/cny_loading_final.jpg";
}


// greeting view.
var GreetingViewController = function(){};

GreetingViewController.greetingView = null;

GreetingViewController.prototype.view = null;
GreetingViewController.prototype.greetings = null;
GreetingViewController.prototype.activeTweens = null;

GreetingViewController.prototype.width = 0;
GreetingViewController.prototype.height = 0;

GreetingViewController.prototype.popup = null;
GreetingViewController.prototype.btnClose = null;

GreetingViewController.prototype.initialize = function(greetings,width,height)
{
	GreetingViewController.greetingView = this;
	this.greetings = greetings;
	
	this.view = document.createElement("div");
	this.view.style.width = width + "px";
	this.view.style.height = height + "px";
	this.view.style.position = "relative";

	var image = new Image;
	image.src = "images/guid.jpg";
	
	var self = this;
	setTimeout(function(){self.showGuid()},4000);
	setTimeout(function(){self.hideGuid()},8000);

	this.resize(width,height);	
}

GreetingViewController.prototype.hideGuid = function()
{
	if(this.popup == null)
		return;
		
	this.view.removeChild(this.popup);
	this.view.removeChild(this.btnClose);
	this.popup = null;
	this.btnClose = null;
}

GreetingViewController.prototype.showGuid = function()
{
	if(this.popup != null)
		return;
	
	var width = JielongCNY.jielongApp.appWidth;
	var height = JielongCNY.jielongApp.appHeight;

	this.popup = document.createElement("img");
	this.popup.src = "images/guid.jpg";
	this.popup.style.position = "absolute";
	this.view.appendChild(this.popup);
	
	this.popup.style['opacity'] = 0;
	this.popup.style['-moz-opacity'] = 0;
	if(this.popup.filters) this.popup.filters.alpha['opacity'] = 0;
	
	this.btnClose = document.createElement("img");
	this.btnClose.src = "images/btn_close_popup.jpg";
	this.btnClose.style.position = "absolute";
	this.btnClose.width = 44;
	this.btnClose.style.cursor = "pointer";
	this.btnClose.height = 44;
	this.view.appendChild(this.btnClose);
	
	this.btnClose.style['opacity'] = 0;
	this.btnClose.style['-moz-opacity'] = 0;
	if(this.btnClose.filters) this.btnClose.filters.alpha['opacity'] = 0;
		
	var rate = Math.min(width / 1280 , height / 473);
		
	var popWidth = 1280 * rate;
	var popHeight = 473 * rate;
	this.popup.width = popWidth;
	this.popup.height = popHeight;
		
	this.popup.style.left = width / 2 - popWidth / 2 + "px";
	this.popup.style.top = height / 2 - popHeight / 2 + "px";
		
	this.btnClose.style.left = width / 2 - popWidth / 2 + popWidth - 65 + "px";
	this.btnClose.style.top = height / 2 - popHeight / 2  + 20 + "px";

	
	var self = this;
	this.btnClose.onclick = function()
	{
		self.view.removeChild(self.popup);
		self.view.removeChild(self.btnClose);
		self.popup = null;
		self.btnClose = null;
	}
	
	var alphaTween1 = new OpacityTween(this.popup,Tween.regularEaseInOut,0, 100, 0.5);
	var alphaTween2 = new OpacityTween(this.btnClose,Tween.regularEaseInOut,0, 100, 0.5);
	alphaTween1.start();
	alphaTween2.start();
}

GreetingViewController.prototype.isStop = false;

GreetingViewController.prototype.stop = function()
{
	if(this.isStop)
		return;
	this.isStop = true;
	
	if(this.xTween  != null)
		this.xTween.stop();

	if(this.greetingView != null)
		this.greetingView.stop();
		
		if(this.activeTweens != null)
		{
			for(var i in this.activeTweens)
			{
				if(this.activeTweens[i].stop != null)
					this.activeTweens[i].stop();
			}
		}
}

GreetingViewController.prototype.resume = function()
{
	if(!this.isStop)
		return;
	this.isStop = false;

	if(this.xTween  != null)
		this.xTween.resume();
	
	if(this.greetingView != null)
		this.greetingView.resume();
		
	if(this.activeTweens != null)
	{
		for(var i in this.activeTweens)
		{
			if(this.activeTweens[i].resume != null)
				this.activeTweens[i].resume();
		}
	}
	
	if(this.needResize)
	{
		this.needResize = false;
		this.resize(this.width,this.height);
	}
}

GreetingViewController.MOVE_WIDTH = 400;
GreetingViewController.MOVE_WIDTH1 = 200;
GreetingViewController.prototype.needResize = false;

GreetingViewController.prototype.resize = function(width,height)
{
	this.width = width + GreetingViewController.MOVE_WIDTH;
	this.height = height;
	
	if(this.popup != null)
	{
		var rate = Math.min(width / 1280 , height / 473);
		
		var popWidth = 1280 * rate;
		var popHeight = 473 * rate;
		this.popup.width = popWidth;
		this.popup.height = popHeight;
		
		this.popup.style.left = width / 2 - popWidth / 2 + "px";
		this.popup.style.top = height / 2 - popHeight / 2 + "px";
		
		this.btnClose.style.left = width / 2 - popWidth / 2 + popWidth - 65 + "px";
		this.btnClose.style.top = height / 2 - popHeight / 2  + 20 + "px";
	}

	if(this.isStop)
	{
		this.needResize = true;
		return;
	}

	if(this.greetingView != null)
	{
		this.greetingView.stop();
		this.view.removeChild(this.greetingView.view);
		this.greetingView = null;
	}
	
	if(this.xTween  != null)
	{
		this.xTween.stop();
		this.xTween = null;
	}
	
	if(this.activeTweens != null)
	{
		for(var i in this.activeTweens)
		{
			if(this.activeTweens[i].stop != null)
				this.activeTweens[i].stop();
		}
		
		this.activeTweens = null;
	}
	
	this.addGreetingView();
}

GreetingViewController.prototype.onComplete = function()
{
	if(this.xTween  != null)
	{
		this.xTween.stop();
		this.xTween = null;
	}

	this.greetingView.delegate = null;
	this.addGreetingView();
}

GreetingViewController.prototype.addGreetingView  = function()
{
	if(this.greetingView != null)
		this.easeOut();
	else
		this.easeIn();
}

GreetingViewController.prototype.xTween = null;
GreetingViewController.prototype.easeIn = function()
{		
	this.greetingView = GreetingListView.createListView(this.width,this.height,this.greetings);
	this.greetingView.delegate = this;
	this.greetingView.view.style.left = 0  + "px";
	this.greetingView.view.style['opacity'] = 0;
	this.greetingView.view.style['-moz-opacity'] = 0;
	this.greetingView.view.style.overflow = "hidden";
	if(this.greetingView.view.filters) 
		this.greetingView.view.filters.alpha['opacity'] = 0;
	
	//var xTween = new Tween(this.greetingView.view.style,'left',Tween.strongEaseOut,this.width,0,1,'px');
	var alphaTween = new OpacityTween(this.greetingView.view,Tween.strongEaseOut,0, 100, 1);
	this.activeTweens = [];
	this.activeTweens.push(alphaTween);
	
	//xTween.start();
	alphaTween.start();
	
	var self = this;
	alphaTween.onMotionFinished = function()
	{
		self.activeTweens = null;
	}
	
	if(this.popup != null)
		this.view.insertBefore(this.greetingView.view,this.popup);
	else
		this.view.appendChild(this.greetingView.view);
	
	var xTween = new Tween(this.greetingView.view.style,'left',Tween.regularEaseInOut,0,-1 * GreetingViewController.MOVE_WIDTH1 ,30.0,'px');
	this.xTween = xTween;
	xTween.start();
	xTween.onMotionFinished = function()
	{
		self.xTween = null;
	}
}

GreetingViewController.prototype.easeOut = function()
{
	if(this.greetingView == null)
		return;

	if(this.xTween != null)
	{
		this.xTween.stop();
		this.xTween = null;
	}
	
	var currentX = Number(this.greetingView.view.style.left.slice(0,this.greetingView.view.style.left.length - 2));
	var xTween = new Tween(this.greetingView.view.style,'left',Tween.regularEaseInOut,currentX,-1 * GreetingViewController.MOVE_WIDTH,0.5,'px');
	var alphaTween = new OpacityTween(this.greetingView.view,Tween.regularEaseInOut,100, 0, 0.5);
	this.activeTweens = [];
	this.activeTweens.push(alphaTween,xTween);
	
	var self = this;
	alphaTween.onMotionFinished = function()
	{
		self.activeTweens = null;
		self.view.removeChild(self.greetingView.view);
		self.greetingView = null;
		self.activeTweens = null;
		self.easeIn();
	}
	
	xTween.start();
	alphaTween.start();
}

GreetingViewController.prototype.onTweenComplete = function()
{
	if(this.greetingView != null)
		this.view.removeChild(this.greetingView.view);
		
	this.greetingView = this.tempView;
	this.tempView = null;
	this.activeTween = null;
}


var ResumeModel = function(methodName,context,greeting,index,startX,startY)
{
	this.index = index;
	this.startX = startX;
	this.startY = startY;
	this.context = context;
	this.greeting = greeting;
	
	this.methodName = methodName;
};

ResumeModel.prototype.methodName = null;
ResumeModel.prototype.index = 0;
ResumeModel.prototype.startX = 0;
ResumeModel.prototype.startY = 0;
ResumeModel.prototype.context = 0;
ResumeModel.prototype.greeting = null;

var GreetingListView = function(){};

GreetingListView.randIndex = -1;
GreetingListView.notFirst = false;
GreetingListView.notSecond = false;

GreetingListView.createListView = function (width,height,greeting)
{
	if(!GreetingListView.notFirst)
	{
		GreetingListView.notFirst = true;
		return new FirstGreetingView(width,height,greeting);
	}
	
	if(!GreetingListView.notSecond)
	{
		GreetingListView.notSecond = true;
		return new SecondGreetingView(width,height,greeting);
	}

	var randIndex;
	do
	{
		randIndex = Math.floor(Math.random() * 3);	
	}while(randIndex == GreetingListView.randIndex);
	GreetingListView.randIndex = randIndex;
	
	switch(randIndex)
	{
		case 0:
			return new GreetingView1(width,height,greeting);
		case 1:
			return new GreetingView2(width,height,greeting);
		case 2:
			return new GreetingView3(width,height,greeting);
	}

	return new GreetingView1(width,height,greeting);
}

GreetingListView.getMatrix = function(points,oriPoints)
{
	var a = ( (points[0].x-points[1].x)*(oriPoints[1].y-oriPoints[2].y) - (points[1].x-points[2].x)*(oriPoints[0].y-oriPoints[1].y) ) /
					( (oriPoints[0].x-oriPoints[1].x)*(oriPoints[1].y-oriPoints[2].y) - (oriPoints[1].x-oriPoints[2].x)*(oriPoints[0].y-oriPoints[1].y) );
	
	var c = ((points[0].x - points[2].x) * (oriPoints[1].x - oriPoints[2].x) - (points[1].x - points[2].x) * (oriPoints[0].x - oriPoints[2].x)) / 
			((oriPoints[1].x - oriPoints[2].x) *(oriPoints[0].y - oriPoints[2].y) - (oriPoints[0].x - oriPoints[2].x) *(oriPoints[1].y - oriPoints[2].y) ) ;
	
	var tx = points[0].x - c * oriPoints[0].y - a * oriPoints[0].x;
	
	var b = ( (points[0].y-points[1].y)*(oriPoints[1].y-oriPoints[2].y) - (points[1].y-points[2].y)*(oriPoints[0].y-oriPoints[1].y) ) /
			( (oriPoints[0].x-oriPoints[1].x)*(oriPoints[1].y-oriPoints[2].y) - (oriPoints[1].x-oriPoints[2].x)*(oriPoints[0].y-oriPoints[1].y) );
			
	var d = ((points[0].y - points[2].y) * (oriPoints[1].x - oriPoints[2].x) - (points[1].y - points[2].y) * (oriPoints[0].x - oriPoints[2].x)) / 
			((oriPoints[1].x - oriPoints[2].x) *(oriPoints[0].y - oriPoints[2].y) - (oriPoints[0].x - oriPoints[2].x) *(oriPoints[1].y - oriPoints[2].y) ) ;
	
	var ty = points[0].y - d * oriPoints[0].y - b * oriPoints[0].x;
			
	return {a:a,b:b,c:c,d:d,tx:tx,ty:ty}; 
}

GreetingListView.getPoint = function(oriPoint,matrix)
{
	return {x:matrix.a * oriPoint.x + matrix.c * oriPoint.y + matrix.tx,
			y:matrix.b * oriPoint.x + matrix.d * oriPoint.y + matrix.ty};
}

GreetingListView.getOriPoint = function(point,matrix)
{
	var y = (matrix.b * point.x - matrix.a * point.y + matrix.a * matrix.ty - matrix.b * matrix.tx) / (matrix.c * matrix.b - matrix.a * matrix.d);
	var x = (matrix.d * point.x - matrix.c * point.y + matrix.c * matrix.ty - matrix.d * matrix.tx) / (matrix.a * matrix.d - matrix.b * matrix.c);
	
	return {x:x,y:y};
}


GreetingListView.REMAIN_INTERVAL = 2000;
GreetingListView.LINE_SPACE = 0;
GreetingListView.WORD_SPACE = 0;
GreetingListView.NORMAL_INTERVAL = 5;
GreetingListView.WORD_INTERVAL = 30;

GreetingListView.prototype.width = 0;
GreetingListView.prototype.height = 0;
GreetingListView.prototype.greetings = null;
GreetingListView.prototype.view = null;
GreetingListView.prototype.container = null;
GreetingListView.prototype.resumeModel = null;
GreetingListView.prototype.canvasContainer = null;

GreetingListView.prototype.matrixeIndex = 0;
GreetingListView.prototype.matrixes = null;
GreetingListView.prototype.needStop = false;

GreetingListView.prototype.userBoxes = null;

GreetingListView.prototype.delegate = null;
GreetingListView.prototype.stop = function()
{
	this.needStop = true;
}


GreetingListView.prototype.resume = function()
{
	this.needStop = false;
	
	if(this.resumeModel != null)
	{
		this[this.resumeModel.methodName](this.resumeModel.context,this.resumeModel.greeting,
									 	  this.resumeModel.index,this.resumeModel.startX,
									 	  this.resumeModel.startY);
		
	}else{
		this.drawCanvas();
	}
	
	this.resumeModel = null;
}

GreetingListView.prototype.initialize = function()
{
	this.view = document.createElement("div");
	this.view.style.position = "absolute";
	this.view.style.width = this.width + "px";
	this.view.style.height = this.height + "px";
	this.view.style.overflow = "hidden";
	
	this.container = document.createElement("div");
	this.container.style.position = "relative";
	this.container.style.width = this.width + "px";
	this.container.style.height = this.height + "px";
	this.view.appendChild(this.container);
	
	this.canvasContainer = document.createElement("div");
	this.canvasContainer.style.width = this.width + "px";
	this.canvasContainer.style.height = this.height + "px";
	this.canvasContainer.style.position = "absolute";
	this.canvasContainer.style.left = "0px";
	this.canvasContainer.style.top = "0px";
	this.canvasContainer.style.cursor = "pointer";
	this.container.appendChild(this.canvasContainer);

	this.userBoxes = [];

	this.matrixeIndex = 0;
	this.drawCanvas();
	
	var self = this;
	this.canvasContainer.onclick = function(event)
	{
		self.findGreeting({x:event.layerX,y:event.layerY});
	}
}

GreetingListView.prototype.findGreeting = function(point)
{
	for(var i = 0;i < this.matrixes.length;i++)
	{
		if(this.matrixes[i].rects != null)
		{
			var oriPoint = GreetingListView.getOriPoint(point,this.matrixes[i].matrix);
			for(var j = 0;j < this.matrixes[i].rects.length;j++)
			{
				var objRect = this.matrixes[i].rects[j];
				var rect = objRect["rect"];
				var greeting = objRect["greeting"];
				
				if(oriPoint.x >= rect.x  && 
				   oriPoint.x <= rect.x + rect.w &&
				   oriPoint.y >= rect.y &&
				   oriPoint.y <= rect.y + rect.h)
				   {
				   		JielongCNY.jielongApp.showGreeting(greeting);
				   		return;
				   }
			}
		}else{
			continue;
		}
	}
}

GreetingListView.prototype.drawCanvas = function()
{
	if(this.matrixeIndex >= this.matrixes.length)
	{
		var self = this;
		setTimeout(function()
		{
			if(self.delegate != null && !self.needStop)
				self.delegate.onComplete();
		},GreetingListView.REMAIN_INTERVAL);
		
		return;
	}

	var canvas = document.createElement("canvas");
	canvas.width = this.width;
	canvas.height = this.height;
	canvas.style.position = "absolute";
	this.canvasContainer.appendChild(canvas,this.userLayer);
	
	var context = canvas.getContext('2d');
	var matrix = this.matrixes[this.matrixeIndex].matrix; 
	context.transform(matrix.a,matrix.b,matrix.c,matrix.d,matrix.tx,matrix.ty);
	context.font = FontManager.getFillFont(this.matrixes[this.matrixeIndex].fontSize);
	
	switch(this.matrixes[this.matrixeIndex].direction)
	{
		case "LRTB":
			context.textBaseline = "top";
			context.textAlign = "left";
			this.drawLRTB(context);
			break;
		
		case "RLTB":
			context.textBaseline = "top";
			context.textAlign = "right";
			this.drawRLTB(context);
			break;
		
		case "LRBT":
			context.textBaseline = "bottom";
			context.textAlign = "left";
			this.drawLRBT(context);
			break;
		
		case "RLBT":
			context.textBaseline = "bottom";
			context.textAlign = "right";
			this.drawRLBT(context);
			break;
		
		case "TBLR":
			context.textBaseline = "top";
			context.textAlign = "left";
			this.drawTBLR(context);
			break;
			
		case "TBRL":
			context.textBaseline = "top";
			context.textAlign = "right";
			this.drawTBRL(context);
			break;
			
		case "BTLR":
			context.textBaseline = "bottom";
			context.textAlign = "left";
			this.drawBTLR(context);
			break;
			
		case "BTRL":
			context.textBaseline = "bottom";
			context.textAlign = "right";
			this.drawBTRL(context);
			break;
			
	}
}

GreetingListView.MAX_BOX_COUNT = 2;
GreetingListView.MAX_RANDOM = 15;

GreetingListView.prototype.addUserBox = function(greeting,matrix,x,y)
{
	if(this.userBoxes.length >= GreetingListView.MAX_BOX_COUNT)
		return;
	
	var rand = Math.floor(Math.random() * GreetingListView.MAX_RANDOM);
	if(rand != 0)
		return;
	
	var point = GreetingListView.getPoint({x:x,y:y},matrix);
	point.y -= 141;
	
	if(point.x < 0 ||
	   point.x + 284 > JielongCNY.jielongApp.appWidth ||
	   point.y < 0 ||
	   point.y + 141 > JielongCNY.jielongApp.appHeight)
	   return;
	
	var rect = {x:point.x,y:point.y,width:284,height:141};
	for(var i = 0;i < this.userBoxes.length;i++)
	{
		var objUser = this.userBoxes[i];
		var itemRect = objUser["rect"];
		 
		if(objUser["index"] == this.matrixeIndex)
			return;
		 
		if(rect.x > itemRect.x + itemRect.width ||
		   rect.x  + rect.width < itemRect.x ||
		   rect.y > itemRect.y + itemRect.height ||
		   rect.y + rect.height < itemRect.y)
		   continue; 
		   
		return;
	}
	

	var userInfo = document.createElement("div");
	userInfo.style.width = "284px";
	userInfo.style.height = "141px";
	userInfo.style.position = "absolute";
	userInfo.style.left = point.x + "px";
	userInfo.style.top = point.y + "px";
	userInfo.style.background = "url(images/right_edge_greeting.png) no-repeat left top";
	userInfo.style.cursor = "pointer";
	
	userInfo.style['opacity'] = 0;
	userInfo.style['-moz-opacity'] = 0;
	userInfo.style.overflow = "hidden";
	if(userInfo.filters) 
		userInfo.filters.alpha['opacity'] = 0;
	
	this.container.appendChild(userInfo);

	var objItem = {view:userInfo,rect:rect,index:this.matrixeIndex};
	this.userBoxes.push(objItem);

	var userWrap = document.createElement("div");
	userWrap.style.position = "relative";
	userWrap.style.marginLeft = "17px";
	userWrap.style.width = "267px";
	userWrap.style.height = "110px";
	userWrap.style.background = "#000000";
	userInfo.appendChild(userWrap);
	
	var userPhoto = document.createElement("img");
	userPhoto.src = greeting["sender_photo"];
	userPhoto.width = 64;
	userPhoto.height = 64;
	userPhoto.style.border = "#FFFFFF 1px solid";
	userPhoto.style.position = "absolute";
	userPhoto.style.left = "10px";
	userPhoto.style.top = "10px";
	userWrap.appendChild(userPhoto);
	
	var username = document.createElement("div");
	username.style.position = "absolute";
	username.style.left = "90px";
	username.style.top = "10px";
	username.innerHTML = greeting["sender_name"];
	username.style.color = "#ce0000";
	username.style.fontSize = "14px";
	username.style.fontFamily = "'STHeiti','黑体','STSong','宋体','STKaiti','楷体'";
	username.style.letterSpacing = "1px";
	username.style.fontWeight = "bold";
	userWrap.appendChild(username);
	
	var receiversName = "@ " + greeting["receivers_name"].split(",").join("<br/>@ ");
	var senderName = document.createElement("span");
	senderName.style.position = "absolute";
	senderName.style.left = "90px";
	senderName.style.top = "27px";
	senderName.innerHTML = receiversName;
	senderName.style.color = "#ffffff";
	senderName.style.fontSize = "14px";
	senderName.style.fontFamily = "'STSong','宋体','STHeiti','黑体','STKaiti','楷体'";
	senderName.style.letterSpacing = "1px";
	senderName.style.lineHeight = "16px";
	senderName.style.fontWeight = "bold";
	userWrap.appendChild(senderName);
	
	var bottomTip = document.createElement("div");
	bottomTip.style.position = "absolute";
	bottomTip.style.left = "1px";
	bottomTip.style.top = "84px";
	bottomTip.style.width = "265px";
	bottomTip.style.height = "25px";
	bottomTip.style.background = "#ffffff";
	bottomTip.style.color = "#000000";
	bottomTip.style.fontSize = "13px";
	bottomTip.style.fontFamily = "'STSong','宋体','STHeiti','黑体','STKaiti','楷体'";
	bottomTip.style.letterSpacing = "0px";
	bottomTip.style.lineHeight = "25px";
	bottomTip.style.textAlign = "center";
	bottomTip.innerHTML = "接龍怎麼少得了你？快來寫成語，發祝福吧！";
	userWrap.appendChild(bottomTip);
	
	var alhpaTween = new OpacityTween(userInfo,Tween.regularEaseInOut,0, 100, 0.5);
	
	alhpaTween.start();
	JielongCNY.jielongApp.playMouseOver();
	userInfo.onclick = function()
	{
		JielongCNY.jielongApp.showGreeting(greeting);	
	}
	
	setTimeout(function()
	{
		var outTween = new OpacityTween(userInfo,Tween.regularEaseInOut,100, 0, 0.5);
		outTween.onMotionFinished = function()
		{
			userInfo.style.display = "none";
		}
		outTween.start();
		
	},2500);
}

GreetingListView.prototype.drawLRTB = function(context,greeting,index,startX,startY)
{
	if(this.needStop)
	{
		this.resumeModel = new ResumeModel("drawLRTB",context,greeting,index,startX,startY);
		return;
	}

	greeting = greeting == null ? this.greetings[Math.floor(Math.random() * this.greetings.length)] : greeting;	
	index = index == null ? 0 : index;
	startX = startX == null ? 0 : startX;
	startY = startY == null ? 0 : startY;
	
	if(startY >= this.height)
	{
		this.matrixeIndex ++;
		this.drawCanvas();
	
		return;
	}
	
	var drawingWord = greeting["content"].charAt(index);
	context.fillText(drawingWord,startX,startY);
	var metrics = context.measureText(drawingWord);
	
	var rect = {x:startX,y:startY,w:metrics.width,h:this.matrixes[this.matrixeIndex].fontSize};
	var objRect = {rect:rect,greeting:greeting};
	
	if(this.matrixes[this.matrixeIndex].rects == null)
		this.matrixes[this.matrixeIndex].rects = [];
	this.matrixes[this.matrixeIndex].rects.push(objRect);
	
	if(index == 3)
		this.addUserBox(greeting,this.matrixes[this.matrixeIndex].matrix,rect.x,rect.y);
	
	startX += metrics.width;
	index++;

	var interval = this.matrixes[this.matrixeIndex].interval;
	if(index >= greeting["content"].length)
	{
		index = 0;
		greeting = this.greetings[Math.floor(Math.random() * this.greetings.length)];
		startX += GreetingListView.WORD_SPACE ;
		interval = this.matrixes[this.matrixeIndex].wordInterval;
	}
	
	if(startX > this.width)
	{
		startX = 0;
		
		if(this.matrixes[this.matrixeIndex].sizeAdd != 0)
		{
			this.matrixes[this.matrixeIndex].fontSize += this.matrixes[this.matrixeIndex].sizeAdd;
			context.font = FontManager.getFillFont(this.matrixes[this.matrixeIndex].fontSize);
		}
		startY += this.matrixes[this.matrixeIndex].fontSize + GreetingListView.LINE_SPACE;
	}
		
	var self = this;
	setTimeout(function(){self.drawLRTB(context,greeting,index,startX,startY)},interval);
}

GreetingListView.prototype.drawRLTB = function(context,greeting,index,startX,startY)
{
	if(this.needStop)
	{
		this.resumeModel = new ResumeModel("drawRLTB",context,greeting,index,startX,startY);
		return;
	}

	greeting = greeting == null ? this.greetings[Math.floor(Math.random() * this.greetings.length)] : greeting;	
	index = index == null ? greeting["content"].length - 1 : index;
	startX = startX == null ? this.width : startX;
	startY = startY == null ? 0 : startY;
	
	if(startY >= this.height)
	{
		this.matrixeIndex ++;
		this.drawCanvas();
	
		return;
	}
	
	var drawingWord = greeting["content"].charAt(index);
	context.fillText(drawingWord,startX,startY);
	var metrics = context.measureText(drawingWord);
	
	var rect = {x:startX - metrics.width,y:startY,w:metrics.width,h:this.matrixes[this.matrixeIndex].fontSize};
	var objRect = {rect:rect,greeting:greeting};
	
	if(this.matrixes[this.matrixeIndex].rects == null)
		this.matrixes[this.matrixeIndex].rects = [];
	this.matrixes[this.matrixeIndex].rects.push(objRect);
	
	if(index == 3)
		this.addUserBox(greeting,this.matrixes[this.matrixeIndex].matrix,rect.x,rect.y);
	
	startX -= metrics.width;
	index--;
	
	var interval = this.matrixes[this.matrixeIndex].interval;
	if(index < 0)
	{
		greeting = this.greetings[Math.floor(Math.random() * this.greetings.length)];
		index = greeting["content"].length - 1;
		
		startX -= GreetingListView.WORD_SPACE ;
		interval = this.matrixes[this.matrixeIndex].wordInterval;
	}
	
	if(startX < 0)
	{
		startX = this.width;
		startY += this.matrixes[this.matrixeIndex].fontSize + GreetingListView.LINE_SPACE;
	}
		
	var self = this;
	setTimeout(function(){self.drawRLTB(context,greeting,index,startX,startY)},interval);
}

GreetingListView.prototype.drawLRBT = function(context,greeting,index,startX,startY)
{
	if(this.needStop)
	{
		this.resumeModel = new ResumeModel("drawLRBT",context,greeting,index,startX,startY);
		return;
	}

	greeting = greeting == null ? this.greetings[Math.floor(Math.random() * this.greetings.length)] : greeting;	
	index = index == null ? 0 : index;
	startX = startX == null ? 0 : startX;
	startY = startY == null ? this.height : startY;
	
	if(startY <= 0)
	{
		this.matrixeIndex ++;
		this.drawCanvas();
	
		return;
	}
	
	var drawingWord = greeting["content"].charAt(index);
	context.fillText(drawingWord,startX,startY);
	var metrics = context.measureText(drawingWord);
	
	var rect = {x:startX,y:startY - this.matrixes[this.matrixeIndex].fontSize,
				w:metrics.width,h:this.matrixes[this.matrixeIndex].fontSize};
	var objRect = {rect:rect,greeting:greeting};
	
	if(this.matrixes[this.matrixeIndex].rects == null)
		this.matrixes[this.matrixeIndex].rects = [];
	this.matrixes[this.matrixeIndex].rects.push(objRect);
	
	if(index == 3)
		this.addUserBox(greeting,this.matrixes[this.matrixeIndex].matrix,rect.x,rect.y);
	
	startX += metrics.width;
	index++;
	
	var interval = this.matrixes[this.matrixeIndex].interval;
	if(index >= greeting["content"].length)
	{
		index = 0;
		greeting = this.greetings[Math.floor(Math.random() * this.greetings.length)];
		startX += GreetingListView.WORD_SPACE ;
		interval = this.matrixes[this.matrixeIndex].wordInterval;
	}
	
	if(startX > this.width)
	{
		startX = 0;
		startY -= this.matrixes[this.matrixeIndex].fontSize + GreetingListView.LINE_SPACE;
	}
		
	var self = this;
	setTimeout(function(){self.drawLRBT(context,greeting,index,startX,startY)},interval);
}

GreetingListView.prototype.drawRLBT = function(context,greeting,index,startX,startY)
{
	if(this.needStop)
	{
		this.resumeModel = new ResumeModel("drawRLBT",context,greeting,index,startX,startY);
		return;
	}

	greeting = greeting == null ? this.greetings[Math.floor(Math.random() * this.greetings.length)] : greeting;	
	index = index == null ? greeting["content"].length - 1 : index;
	startX = startX == null ? this.width : startX;
	startY = startY == null ? this.height : startY;
	
	if(startY <= 0)
	{
		this.matrixeIndex ++;
		this.drawCanvas();
	
		return;
	}
	
	var drawingWord = greeting["content"].charAt(index);
	context.fillText(drawingWord,startX,startY);
	var metrics = context.measureText(drawingWord);
	
	var rect = {x:startX - metrics.width,y:startY - this.matrixes[this.matrixeIndex].fontSize,
				w:metrics.width,h:this.matrixes[this.matrixeIndex].fontSize};
	var objRect = {rect:rect,greeting:greeting};
	
	if(this.matrixes[this.matrixeIndex].rects == null)
		this.matrixes[this.matrixeIndex].rects = [];
	this.matrixes[this.matrixeIndex].rects.push(objRect);
	
	if(index == 3)
		this.addUserBox(greeting,this.matrixes[this.matrixeIndex].matrix,rect.x,rect.y);
	
	startX -= metrics.width;
	index--;
	
	var interval = this.matrixes[this.matrixeIndex].interval;
	if(index < 0)
	{
		greeting = this.greetings[Math.floor(Math.random() * this.greetings.length)];
		index = greeting["content"].length - 1;
		
		startX -= GreetingListView.WORD_SPACE ;
		interval = this.matrixes[this.matrixeIndex].wordInterval;
	}
	
	if(startX < 0)
	{
		startX = this.width;
		startY -= this.matrixes[this.matrixeIndex].fontSize + GreetingListView.LINE_SPACE;
	}
		
	var self = this;
	setTimeout(function(){self.drawRLBT(context,greeting,index,startX,startY)},interval);
}

GreetingListView.prototype.drawTBLR = function(context,greeting,index,startX,startY)
{
	if(this.needStop)
	{
		this.resumeModel = new ResumeModel("drawTBLR",context,greeting,index,startX,startY);
		return;
	}

	greeting = greeting == null ? this.greetings[Math.floor(Math.random() * this.greetings.length)] : greeting;	
	index = index == null ? 0 : index;
	startX = startX == null ? 0 : startX;
	startY = startY == null ? 0 : startY;
	
	if(startX >= this.width)
	{
		this.matrixeIndex ++;
		this.drawCanvas();
	
		return;
	}
	
	var drawingWord = greeting["content"].charAt(index);
	context.fillText(drawingWord,startX,startY);
	var metrics = context.measureText(drawingWord);
	
	var rect = {x:startX,y:startY,
				w:metrics.width,h:this.matrixes[this.matrixeIndex].fontSize};
	var objRect = {rect:rect,greeting:greeting};
	
	if(this.matrixes[this.matrixeIndex].rects == null)
		this.matrixes[this.matrixeIndex].rects = [];
	this.matrixes[this.matrixeIndex].rects.push(objRect);
	
	if(index == 3)
		this.addUserBox(greeting,this.matrixes[this.matrixeIndex].matrix,rect.x,rect.y);
	
	startY += this.matrixes[this.matrixeIndex].fontSize;
	index++;
	
	var interval = this.matrixes[this.matrixeIndex].interval;
	if(index >= greeting["content"].length)
	{
		index = 0;
		greeting = this.greetings[Math.floor(Math.random() * this.greetings.length)];
		startY += GreetingListView.WORD_SPACE ;
		interval = this.matrixes[this.matrixeIndex].wordInterval;
	}
	
	if(startY > this.height)
	{
		startY = 0;
		startX += metrics.width + GreetingListView.LINE_SPACE;
	}
		
	var self = this;
	setTimeout(function(){self.drawTBLR(context,greeting,index,startX,startY)},interval);
}

GreetingListView.prototype.drawTBRL = function(context,greeting,index,startX,startY)
{
	if(this.needStop)
	{
		this.resumeModel = new ResumeModel("drawTBRL",context,greeting,index,startX,startY);
		return;
	}

	greeting = greeting == null ? this.greetings[Math.floor(Math.random() * this.greetings.length)] : greeting;	
	index = index == null ? 0 : index;
	startX = startX == null ? this.width : startX;
	startY = startY == null ? 0 : startY;
	
	if(startX <= 0)
	{
		this.matrixeIndex ++;
		this.drawCanvas();
	
		return;
	}
	
	var drawingWord = greeting["content"].charAt(index);
	context.fillText(drawingWord,startX,startY);
	var metrics = context.measureText(drawingWord);
	
	var rect = {x:startX - metrics.width,y:startY,
				w:metrics.width,h:this.matrixes[this.matrixeIndex].fontSize};
	var objRect = {rect:rect,greeting:greeting};
	
	if(this.matrixes[this.matrixeIndex].rects == null)
		this.matrixes[this.matrixeIndex].rects = [];
	this.matrixes[this.matrixeIndex].rects.push(objRect);
	
	if(index == 3)
		this.addUserBox(greeting,this.matrixes[this.matrixeIndex].matrix,rect.x,rect.y);
	
	startY += this.matrixes[this.matrixeIndex].fontSize;
	index++;
	
	var interval = this.matrixes[this.matrixeIndex].interval;
	if(index >= greeting["content"].length)
	{
		index = 0;
		greeting = this.greetings[Math.floor(Math.random() * this.greetings.length)];
		startY += GreetingListView.WORD_SPACE ;
		interval = this.matrixes[this.matrixeIndex].wordInterval;
	}
	
	if(startY > this.height)
	{
		startY = 0;
		startX -= metrics.width + GreetingListView.LINE_SPACE;
	}
		
	var self = this;
	setTimeout(function(){self.drawTBRL(context,greeting,index,startX,startY)},interval);
}

GreetingListView.prototype.drawBTLR = function(context,greeting,index,startX,startY)
{
	if(this.needStop)
	{
		this.resumeModel = new ResumeModel("drawBTLR",context,greeting,index,startX,startY);
		return;
	}

	greeting = greeting == null ? this.greetings[Math.floor(Math.random() * this.greetings.length)] : greeting;	
	index = index == null ? greeting["content"].length - 1 : index;
	startX = startX == null ? 0 : startX;
	startY = startY == null ? this.height : startY;
	
	if(startX >= this.width)
	{
		this.matrixeIndex ++;
		this.drawCanvas();
	
		return;
	}
	
	var drawingWord = greeting["content"].charAt(index);
	context.fillText(drawingWord,startX,startY);
	var metrics = context.measureText(drawingWord);
	
	var rect = {x:startX,y:startY - this.matrixes[this.matrixeIndex].fontSize,
				w:metrics.width,h:this.matrixes[this.matrixeIndex].fontSize};
	var objRect = {rect:rect,greeting:greeting};
	
	if(this.matrixes[this.matrixeIndex].rects == null)
		this.matrixes[this.matrixeIndex].rects = [];
	this.matrixes[this.matrixeIndex].rects.push(objRect);
	
	if(index == 3)
		this.addUserBox(greeting,this.matrixes[this.matrixeIndex].matrix,rect.x,rect.y);
	
	startY -= this.matrixes[this.matrixeIndex].fontSize;
	index--;
	
	var interval = this.matrixes[this.matrixeIndex].interval;
	if(index < 0)
	{
		greeting = this.greetings[Math.floor(Math.random() * this.greetings.length)];
		index = greeting["content"].length - 1;
		startY -= GreetingListView.WORD_SPACE ;
		interval = this.matrixes[this.matrixeIndex].wordInterval;
	}
	
	if(startY < 0)
	{
		startY = this.height;
		startX += metrics.width + GreetingListView.LINE_SPACE;
	}
		
	var self = this;
	setTimeout(function(){self.drawBTLR(context,greeting,index,startX,startY)},interval);
}

GreetingListView.prototype.drawBTRL = function(context,greeting,index,startX,startY)
{
	if(this.needStop)
	{
		this.resumeModel = new ResumeModel("drawBTRL",context,greeting,index,startX,startY);
		return;
	}

	greeting = greeting == null ? this.greetings[Math.floor(Math.random() * this.greetings.length)] : greeting;	
	index = index == null ? greeting["content"].length - 1 : index;
	startX = startX == null ? this.width : startX;
	startY = startY == null ? this.height : startY;
	
	if(startX <= 0)
	{
		this.matrixeIndex ++;
		this.drawCanvas();
	
		return;
	}
	
	var drawingWord = greeting["content"].charAt(index);
	context.fillText(drawingWord,startX,startY);
	var metrics = context.measureText(drawingWord);
	
	var rect = {x:startX - metrics.width,y:startY - this.matrixes[this.matrixeIndex].fontSize,
				w:metrics.width,h:this.matrixes[this.matrixeIndex].fontSize};
	var objRect = {rect:rect,greeting:greeting};
	
	if(this.matrixes[this.matrixeIndex].rects == null)
		this.matrixes[this.matrixeIndex].rects = [];
	this.matrixes[this.matrixeIndex].rects.push(objRect);
	
	if(index == 3)
		this.addUserBox(greeting,this.matrixes[this.matrixeIndex].matrix,rect.x,rect.y);
	
	startY -= this.matrixes[this.matrixeIndex].fontSize;
	index--;
	
	var interval = this.matrixes[this.matrixeIndex].interval;
	if(index < 0)
	{
		greeting = this.greetings[Math.floor(Math.random() * this.greetings.length)];
		index = greeting["content"].length - 1;
		startY -= GreetingListView.WORD_SPACE ;
		interval = this.matrixes[this.matrixeIndex].wordInterval;
	}
	
	if(startY < 0)
	{
		startY = this.height;
		startX -= metrics.width + GreetingListView.LINE_SPACE;
	}
		
	var self = this;
	setTimeout(function(){self.drawBTRL(context,greeting,index,startX,startY)},interval);
}

var GreetingView1 = function(width,height,greetings)
{
	this.width = width;
	this.height = height;
	this.greetings = greetings;
	
	var k = Math.tan(40 / 180 * Math.PI);
	var b = height / 2 - width / 2 * k;

	var matrix1 = new MatrixModel;
	matrix1.fontSize = 33;
	var points1 = [{x:0,y:b},{x:(height - b) / k,y:height},{x:0,y:height}];
	var oriPoints1 = [{x:width,y:0},{x:width,y:height},{x:0,y:0}];
	matrix1.matrix = GreetingListView.getMatrix(points1,oriPoints1);
	matrix1.interval = 2;
	matrix1.wordInterval = 5;
	matrix1.direction = "RLTB";
	
	var matrix2 = new MatrixModel;
	matrix2.fontSize = 90;
	var points2 = [{x:-b/k,y:0},{x:(height - b) / k,y:height},{x:width,y:0}];
	var oriPoints2 = [{x:0,y:0},{x:0,y:height},{x:width,y:0}];
	matrix2.matrix = GreetingListView.getMatrix(points2,oriPoints2);
	matrix2.direction = "LRTB";
	
	this.matrixes = [matrix1,matrix2];
	
	this.initialize();
}

GreetingView1.prototype = new GreetingListView;

var GreetingView2 = function(width,height,greetings)
{
	this.width = width;
	this.height = height;
	this.greetings = greetings;

	var interPoint = {x:width / 5 * 3, y:height / 4 * 3};
	var k1 = Math.tan(15 / 180 * Math.PI);
	var b1 = interPoint.y - k1 * interPoint.x;
	
	var k2 = Math.tan(- 35 / 180 * Math.PI);
	var b2 = interPoint.y - k2 * interPoint.x;
	
	var matrix1 = new MatrixModel;
	matrix1.fontSize = 100;
	var points1 = [{x:0,y:b1},{x:interPoint.x,y:interPoint.y},{x:interPoint.x,y:0}];
	var oriPoints1 = [{x:0,y:height},{x:width,y:height},{x:width,y:0}];
	matrix1.matrix = GreetingListView.getMatrix(points1,oriPoints1);
	matrix1.direction = "RLBT";
	
	var matrix2 = new MatrixModel;
	matrix2.fontSize = 65;
	var points2 = [{x:interPoint.x,y:0},{x:interPoint.x,y:interPoint.y},{x:width,y:k2 * width + b2}];
	var oriPoints2 = [{x:0,y:0},{x:0,y:height},{x:width,y:height}];
	matrix2.matrix = GreetingListView.getMatrix(points2,oriPoints2);
	matrix2.direction = "LRBT";
	
	var matrix3 = new MatrixModel;
	matrix3.fontSize = 55;
	var points3 = [{x:(height - b2)/k2,y:height},{x:width,y:height},{x:width,y:k2 * width + b2}];
	var oriPoints3 = [{x:0,y:0},{x:0,y:height},{x:width,y:0}];
	matrix3.matrix = GreetingListView.getMatrix(points3,oriPoints3);
	matrix3.direction = "LRTB";
	
	var k3 = k1;
	var b3 = height - k3 * 0;
	var x3 = (b3-b2) / (k2-k3);
	var y3 = k3 *x3 + b3;
	var matrix4 = new MatrixModel;
	matrix4.fontSize = 40;
	var points4 = [{x:0,y:b1},{x:interPoint.x,y:interPoint.y},{x:x3,y:y3}];
	var oriPoints4 = [{x:0,y:0},{x:width,y:0},{x:width,y:height}];
	matrix4.matrix = GreetingListView.getMatrix(points4,oriPoints4);
	matrix4.direction = "RLTB";
	
	this.matrixes = [matrix1,matrix2,matrix3,matrix4];
	
	this.initialize();
}

GreetingView2.prototype = new GreetingListView;


var GreetingView3 = function(width,height,greetings)
{
	this.width = width;
	this.height = height;
	this.greetings = greetings;
	
	var interPoint = {x:width / 5 * 3, y:height / 7 * 4};
	var k1 = Math.tan(5 / 180 * Math.PI);
	var b1 = interPoint.y - k1 * interPoint.x
	
	var k2 = (0 - interPoint.y) / (width - interPoint.x);
	var b2 = interPoint.y - k2 * interPoint.x;

	var matrix1 = new MatrixModel;
	matrix1.fontSize = 100;
	x1 = b1 / (k2 - k1);
	y1 = k2 * x1;
	var points1 = [{x:x1,y:y1},{x:width,y:0},{x:interPoint.x,y:interPoint.y}];
	var oriPoints1 = [{x:0,y:height},{x:width,y:0},{x:width,y:height}];
	matrix1.matrix = GreetingListView.getMatrix(points1,oriPoints1);
	matrix1.direction = "RLBT";
	
	var matrix2 = new MatrixModel;
	matrix2.fontSize = 65;
	var points2 = [{x:0,y:b1},{x:0,y:height},{x:interPoint.x,y:interPoint.y}];
	var oriPoints2 = [{x:0,y:0},{x:0,y:height},{x:width,y:0}];
	matrix2.matrix = GreetingListView.getMatrix(points2,oriPoints2);
	matrix2.direction = "RLTB";
	
	var matrix3 = new MatrixModel;
	matrix3.fontSize = 75;
	var points3 = [{x:interPoint.x,y:interPoint.y},{x:width,y:0},{x:width,y:height}];
	var oriPoints3 = [{x:0,y:0},{x:width,y:0},{x:width,y:height}];
	matrix3.matrix = GreetingListView.getMatrix(points3,oriPoints3);
	matrix3.direction = "LRTB";

	this.matrixes = [matrix1,matrix2,matrix3];
	
	this.initialize();
}

GreetingView3.prototype = new GreetingListView;


var FirstGreetingView = function(width,height,greetings)
{
	this.width = width;
	this.height = height;
	this.greetings = greetings;
	
	var matrix = new MatrixModel;
	matrix.fontSize = 30;
	matrix.matrix = {a:1,b:0,c:0,d:1,tx:0,ty:0};
	matrix.sizeAdd = 10;
	matrix.direction = "LRTB";
	
	this.matrixes = [matrix];
	
	this.initialize();
}

FirstGreetingView.prototype = new GreetingListView;


var SecondGreetingView = function(width,height,greetings)
{
	this.width = width;
	this.height = height;
	this.greetings = greetings;
	
	var matrix = new MatrixModel;
	matrix.fontSize = 65;
	matrix.matrix = {a:1,b:0,c:0,d:1,tx:0,ty:0};
	matrix.direction = "TBRL";
	matrix.interval = 30;
	matrix.wordInterval = 50;
	
	this.matrixes = [matrix];
	
	this.initialize();
}

SecondGreetingView.prototype = new GreetingListView;


var MatrixModel = function(){};
MatrixModel.prototype.fontSize = 0;
MatrixModel.prototype.direction = null;
MatrixModel.prototype.matrix = null;
MatrixModel.prototype.rects = null;
MatrixModel.prototype.sizeAdd = 0;
MatrixModel.prototype.interval = 5;
MatrixModel.prototype.wordInterval = 30;

//scroller view.
var ScrollerView = function(greetings)
{
	this.view = document.createElement("div");
	this.view.style.width = 200 + "px";
	this.view.style.height = 25 + "px";
	this.view.style.position = "absolute";
	
	this.container = document.createElement("div");
	this.container.style.width = 200 + "px";
	this.container.style.height = 25 + "px";
	this.container.style.position = "relative";
	this.container.style.overflow = "hidden";
	this.view.appendChild(this.container);
	
	var self = this;
	
	this.greetings = greetings;
	if(greetings != null && greetings.length > 0)
		this.switchItem();
}

var p = ScrollerView.prototype;
p.greetings = null;
p.greeting = null;
p.view = null;
p.container = null;
p.currentItemView = null;
p.tempItemView = null;

p.switchItem = function()
{
	var greeting = null;
	do
	{
		var rndIndex = Math.floor(Math.random() * this.greetings.length);
		greeting = this.greetings[rndIndex];
	}while(greeting == this.greeting);
	this.greeting = greeting;
	
	var userPhoto = new Image;
	userPhoto.src = greeting['sender_photo'];
	var self = this;
	userPhoto.onload = function(){self.attachContent()};
	
	if(this.currentItemView != null)
		this.currentItemView.onclick = null;
}

p.attachContent = function()
{
	var itemView = document.createElement("div");
	itemView.style.width = "200px";
	itemView.style.height = "25px";
	itemView.style.position = "absolute";
	itemView.style.left = "200px";
	itemView.style.top = "0px";
	itemView.style.overflow = "hidden";
	this.tempItemView = itemView;
	this.container.appendChild(itemView);
	
	var itemContainer = document.createElement("div");
	itemContainer.style.width = "200px";
	itemContainer.style.height = "25px";
	itemContainer.style.position = "relative";
	itemView.appendChild(itemContainer);
	
	var img = document.createElement("img");
	img.src = this.greeting["sender_photo"];
	img.style.position = "absolute";
	img.style.left = "0px";
	img.style.top = "0px";
	img.style.width = "25px";
	img.style.height = "25px";
	itemContainer.appendChild(img);
	
	var txtView = document.createElement("div");
	txtView.style.width = "175px";
	txtView.style.height = "25px";
	txtView.style.position = "absolute";
	txtView.style.top = "0px";
	txtView.style.left = "25px";
	txtView.style.lineHeight = "25px";
	txtView.style.paddingLeft = "5px";
	txtView.style.paddingRight = "5px";
	txtView.style.letterSpacing = "1px";
	txtView.style.fontFamily = FontManager.getNormalFont();
	txtView.style.fontSize = "12px";
	txtView.style.color = "#FFFFFF";
	txtView.innerHTML = this.greeting['sender_name'] + "：" + this.greeting['content'];
	itemContainer.appendChild(txtView);
	
	if(this.currentItemView != null)
	{
		var outTween = new Tween(this.currentItemView.style,'left',Tween.regularEaseInOut,0,-200,1.0,'px');
		outTween.start();
	}
	
	
	var inTween = new Tween(this.tempItemView.style,'left',Tween.regularEaseInOut,200,0,1.0,'px');
	var self = this;
	inTween.onMotionFinished = function()
	{
		self.onEaseInOver();
	}
	
	inTween.start();
}

p.onEaseInOver = function()
{
	if(this.currentItemView != null)
		this.container.removeChild(this.currentItemView);

	this.currentItemView = this.tempItemView;
	this.tempItemView = null;
	
	var self = this;
	this.currentItemView.onclick = function()
	{
		JielongCNY.jielongApp.showGreeting(self.greeting);
		JielongCNY.jielongApp.bottomView.hidden = true;
		JielongCNY.jielongApp.bottomView.view.style.display = "none";
	}
	
	var self = this;
	setTimeout(function(){self.switchItem()},4000);
}

// bottom View;
var BottomViewController = function(){};
BottomViewController.VIEW_HEIGHT = 71;
BottomViewController.LOW_HEIGHT = 50;
BottomViewController.RT_WIDTH = 316;
BottomViewController.RB_WIDTH = 332; 
BottomViewController.SEARCH_DEFAULT_TEXT = "搜索好友微博";

BottomViewController.prototype.greetings = null;
BottomViewController.prototype.view = null;
BottomViewController.prototype.bgCanvas = null;
BottomViewController.prototype.searchText = null;
BottomViewController.prototype.sendBox = null; 
BottomViewController.prototype.sendTip = null;

BottomViewController.prototype.isMute = false;
BottomViewController.prototype.opacityTween = null;
BottomViewController.prototype.yTween = null;
BottomViewController.prototype.hidden = false;
BottomViewController.prototype.tipTween = null;
BottomViewController.prototype.tipAlphaTween = null;

BottomViewController.prototype.width = null;
BottomViewController.prototype.height = null;
BottomViewController.prototype.notFirst = false;

BottomViewController.prototype.weiboLink = null;
BottomViewController.prototype.scroller = null;

BottomViewController.prototype.initialize = function(width,height,greetings)
{
	var self = this;
	this.greetings = greetings;
	
	// build ui.
	this.view = document.createElement("div");
	this.view.style.width = width + "px";
	this.view.style.position = "absolute";
	
	//create bg.
	this.bgCanvas = document.createElement("canvas");
	this.view.appendChild(this.bgCanvas);
	
	//create element.
	var logoLink = document.createElement("a");
	logoLink.href = "http://www.greatworks.cn ";
	logoLink.target = "_blank";
	this.view.appendChild(logoLink);
	var logo = document.createElement("img");
	logo.src = "images/navi_logo.jpg";
	logo.width = 80;
	logo.height = 33;
	logo.style.position = "absolute";
	logo.style.left = "0px";
	logo.style.top = "30px";
	logoLink.appendChild(logo);
	
	var weiboLink = document.createElement("a")
	weiboLink.href = "http://www.weibo.com/greatworks";
	weiboLink.target = "_blank";
	weiboLink.style.border = "0";
	weiboLink.style.display = "block"
	weiboLink.style.width = "200px";
	weiboLink.style.height = "23px";
	weiboLink.style.left = "135px"
	weiboLink.style.top = "35px"
	weiboLink.style.position = "absolute";
	var wbImg = document.createElement('img');
	wbImg.src = "images/follow_great_work.jpg";
	weiboLink.appendChild(wbImg);
	this.view.appendChild(weiboLink);
	this.weiboLink = weiboLink;
	
	this.scroller = new ScrollerView(greetings);
	this.scroller.view.style.left = "135px";
	this.scroller.view.style.top = "34px";
	this.view.appendChild(this.scroller.view);
	this.scroller.view.style.display = "none";
	
	var self = this;
	setInterval(function()
	{
		var rand = Math.floor(Math.random() * 2);
		self.weiboLink.style.display = rand == 0 ? "block" : "none";
		self.scroller.view.style.display = rand == 0 ? "none" : "block";
	},20000)
	
	var slash1 = document.createElement("img");
	slash1.src = "images/slash.jpg";
	slash1.width = 9;
	slash1.height = 18;
	slash1.style.position = "absolute";
	slash1.style.left = "346px";
	slash1.style.top = "38px";
	this.view.appendChild(slash1);
	
	var searchBox = document.createElement("div");
	searchBox.style.position = "absolute";
	searchBox.style.left = "366px";
	searchBox.style.top = "34px";
	searchBox.style.width = "144px";
	searchBox.style.height = "23px";
	this.view.appendChild(searchBox);
	
	var searchContainer = document.createElement("div")
	searchContainer.style.position = "relative";
	searchContainer.style.width = "144px";
	searchContainer.style.height = "23px";
	searchBox.appendChild(searchContainer);
	
	var searchForm = document.createElement("form");
	searchContainer.appendChild(searchForm);
	
	var txtSearch = document.createElement("input");
	txtSearch.type = "input";
	txtSearch.style.position = "absolute";
	txtSearch.style.left = "0px";
	txtSearch.style.top = "1px";
	txtSearch.style.width = "121px";
	txtSearch.style.height = "18px";
	txtSearch.width = 121;
	txtSearch.height = 23;
	txtSearch.style.border = "1px solid #ce0000";
	txtSearch.style.background = "#000000";
	txtSearch.style.color = "#808080";
	txtSearch.style.fontSize = "14px";
	txtSearch.value = BottomViewController.SEARCH_DEFAULT_TEXT;
	txtSearch.maxLength = 30;
	this.searchText = txtSearch;
	searchForm.appendChild(txtSearch);
	
	var btnSearch = document.createElement("input")
	btnSearch.type = "submit";
	btnSearch.value = "";
	btnSearch.style.position = "absolute";
	btnSearch.style.left = "121px";
	btnSearch.style.top = "0px";
	btnSearch.style.width = "23px";
	btnSearch.style.height = "23px";
	btnSearch.width = 23;
	btnSearch.height = 23;
	btnSearch.style.border = "0";
	btnSearch.style.background = "url(images/btn_search.jpg) no-repeat";
	searchForm.appendChild(btnSearch);
	
	txtSearch.onclick = function()
	{
		if(txtSearch.value == BottomViewController.SEARCH_DEFAULT_TEXT)
		{
			txtSearch.value = "";
			txtSearch.focus();
		}
	}
	
	searchForm.onsubmit = function ()
	{
		if(txtSearch.value.length < 0 ||
		   txtSearch.value == BottomViewController.SEARCH_DEFAULT_TEXT)
			{
				alert("请输入好友昵称！");
				txtSearch.focus;
				return false;
			}
			
		setTimeout(function(){
			var searchView = new SearchView(txtSearch.value,JielongCNY.jielongApp.appWidth,JielongCNY.jielongApp.appHeight);
			JielongCNY.jielongApp.popup(searchView.view);
			JielongCNY.jielongApp.popupController = searchView;
			txtSearch.value = BottomViewController.SEARCH_DEFAULT_TEXT;
			},50);
		return false;  
	}
	
	var slash1 = document.createElement("img");
	slash1.src = "images/slash.jpg";
	slash1.width = 9;
	slash1.height = 18;
	slash1.style.position = "absolute";
	slash1.style.left = "520px";
	slash1.style.top = "38px";
	this.view.appendChild(slash1);
	
	var btnSina = document.createElement("input");
	btnSina.style.border = "0";
	btnSina.style.background = "url(images/sina_logo.jpg)";
	btnSina.style.width = "19px";
	btnSina.style.height = "17px";
	btnSina.style.position = "absolute";
	btnSina.style.left = "540px";
	btnSina.style.top = "38px";
	btnSina.width = 19;
	btnSina.height = 17;
	btnSina.type = "button";
	this.view.appendChild(btnSina);
	var shareTitle = SendView.SHARE_COPY[Math.floor(SendView.SHARE_COPY.length * Math.random())];
	var shareLink = window.location.hash.length == 0 ? window.location.href : window.location.href.slice(0,window.location.href.length - window.location.hash.length);
	btnSina.onclick = function()
	{
		var query = "url=" + shareLink +"&title=" + shareTitle;
		window.open("http://v.t.sina.com.cn/share/share.php?" + query);
	}
	
	var btnRenren = document.createElement("input");
	btnRenren.style.border = "0";
	btnRenren.style.background = "url(images/renren_logo.jpg)";
	btnRenren.style.width = "19px";
	btnRenren.style.height = "17px";
	btnRenren.style.position = "absolute";
	btnRenren.style.left = "570px";
	btnRenren.style.top = "38px";
	btnRenren.width = 19;
	btnRenren.height = 17;
	btnRenren.type = "button";
	this.view.appendChild(btnRenren);
	
	btnRenren.onclick = function()
	{
		var query = "link=" + "http://jielongcny.sinaapp.com/renren_share.html" + "&title" + shareTitle;
		window.open("http://share.renren.com/share/buttonshare.do?" + query);
	}
	
	var btnQQ = document.createElement("input");
	btnQQ.style.border = "0";
	btnQQ.style.background = "url(images/qq_logo.jpg)";
	btnQQ.style.width = "19px";
	btnQQ.style.height = "17px";
	btnQQ.style.position = "absolute";
	btnQQ.style.left = "600px";
	btnQQ.style.top = "38px";
	btnQQ.width = 19;
	btnQQ.height = 17;
	btnQQ.type = "button";
	this.view.appendChild(btnQQ);
	
	btnQQ.onclick = function()
	{
		var query = "c=share&a=index&title=" + shareTitle + "&url=" + shareLink;
		window.open("http://share.v.t.qq.com/index.php?" + query);
	}
	
	var slash1 = document.createElement("img");
	slash1.src = "images/slash.jpg";
	slash1.width = 9;
	slash1.height = 18;
	slash1.style.position = "absolute";
	slash1.style.left = "630px";
	slash1.style.top = "38px";
	this.view.appendChild(slash1);
	
	var btnSound = document.createElement("input");
	btnSound.style.border = "0";
	btnSound.style.background = "url(images/play_icon.jpg)";
	btnSound.style.width = "13px";
	btnSound.style.height = "11px";
	btnSound.style.position = "absolute";
	btnSound.style.left = "655px";
	btnSound.style.top = "41px";
	btnSound.width = 13;
	btnSound.height = 11;
	btnSound.type = "button";
	this.view.appendChild(btnSound);
	
	btnSound.onclick = function()
	{
		self.isMute = !self.isMute;
		btnSound.style.background = self.isMute ?  "url(images/mute_icon.jpg)" : "url(images/play_icon.jpg)";
		
		if(self.isMute)
			JielongCNY.jielongApp.player.pause();
		else
			JielongCNY.jielongApp.player.play();	
			
		JielongCNY.jielongApp.isMute = self.isMute;
	}
		
	var sendBox = document.createElement("div");
	sendBox.style.position = "absolute";
	sendBox.style.width = "";	
	
	this.sendBox = document.createElement("div");
	this.sendBox.style.position = "absolute"
	this.sendBox.style.width = BottomViewController.RT_WIDTH + "px";
	this.sendBox.style.height = BottomViewController.VIEW_HEIGHT + "px";
	this.view.appendChild(this.sendBox);
	
	var sendContainer = document.createElement("div");
	sendContainer.style.position = "relative"
	sendContainer.style.width = BottomViewController.RT_WIDTH + "px";
	sendContainer.style.height = BottomViewController.VIEW_HEIGHT + "px";
	this.sendBox.appendChild(sendContainer);
	
	var sendForm = document.createElement("form");
	sendContainer.appendChild(sendForm);
	
	var txtSend = document.createElement("input");
	txtSend.style.type = "text";
	txtSend.style.position = "absolute";
	txtSend.style.left = "9px";
	txtSend.style.top = "9px";
	txtSend.style.width = "215px";
	txtSend.style.height = "53px";
	txtSend.style.border = "0";
	txtSend.style.background = "url(images/input_greeting_bg.jpg) no-repeat";
	txtSend.maxLength = 4;
	txtSend.style.fontFamily = "'STKaiti','楷体','STSong','宋体','STHeiti','黑体'";
	txtSend.style.fontSize = "40px";
	txtSend.style.letterSpacing = "17px";
	var checkSendText = function()
	{
		if(txtSend.scrollLeft > 0)
			txtSend.scrollLeft = 0;
		
		txtSend.value = txtSend.value.replace(/[^\u4E00-\u9FA5\w\d]/g,"");
	}
	setInterval(checkSendText,50);
	sendForm.appendChild(txtSend);
	
	var btnSend = document.createElement("input");
	btnSend.type = "submit";
	btnSend.value = "";
	btnSend.width = 84;
	btnSend.height = 55;
	btnSend.style.position = "absolute";
	btnSend.style.left = "225px";
	btnSend.style.top = "8px";
	btnSend.style.width = "84px";
	btnSend.style.height = "55px";
	btnSend.style.border = "0";
	btnSend.style.background = "url(images/btn_send_greeting.jpg) no-repeat";
	sendForm.appendChild(btnSend);

	sendForm.onsubmit = function()
	{
		if(txtSend.value.length < 4)
		{
			alert("请输入四字中文！");
			txtSend.focus();
			return false;
		}
		
		var pattern = /[^\u4E00-\u9FA5]/g;
		if(pattern.test(txtSend.value))
		{
			txtSend.value = txtSend.value.replace(pattern,"");
			alert("请输入四字中文！");
			txtSend.focus();
			return false;
		}
		
		if(JielongCNY.jielongApp.userInfo != null)
			setTimeout(function(){
				JielongCNY.jielongApp.selectFriend(txtSend.value);
				txtSend.value = "";},50);
		else
			setTimeout(function(){
				JielongCNY.jielongApp.login(txtSend.value);
				txtSend.value = "";},50);
			
		return false;
	}
	
	this.sendTip = document.createElement("div");
	this.sendTip.style.position = "absolute";
	this.sendTip.style.top = "0px";
	this.sendTip.style.width = "181px";
	this.sendTip.style.height = "48px";
	this.sendTip.style.background = "url(images/send_tip_edge.png) no-repeat left top";
	this.sendTip.style.cursor = "pointer";
	this.sendTip.onclick = function()
	{
		var greetingView = JielongCNY.jielongApp.greetingView;
		if(greetingView != null)
			greetingView.showGuid();
	}
	
	this.sendTip.style['opacity'] = 0;
	this.sendTip.style['-moz-opacity'] = 0;
	if(this.sendTip.filters) this.sendTip.filters.alpha['opacity'] = 0;
	
	this.view.appendChild(this.sendTip);
	
	var tipBox = document.createElement("div");
	tipBox.style.marginLeft = "7px";
	tipBox.style.background = "#000000";
	tipBox.style.height = "28px";
	tipBox.style.width = "174px";
	tipBox.style.textAlign = "center";
	tipBox.style.fontSize = "12px";
	tipBox.style.color = "#ce0000";
	tipBox.style.lineHeight = "28px";
	tipBox.innerHTML = "輸入四字祝福 接龍开年红";
	this.sendTip.appendChild(tipBox);
	
	this.tipTween = new Tween(this.sendTip.style,
							"top",
							Tween.strongEaseInOut,
							-10,
							-30,
							1,"px");;
	this.tipAlphaTween = new OpacityTween(this.sendTip,Tween.strongEaseInOut, 0, 100, 0.5);
	
	this.hidden = true;

	this.resize(width,height);
	
	
	this.view.style['opacity'] = 0;
	this.view.style['-moz-opacity'] = 0;
	if(this.view.filters) this.view.filters.alpha['opacity'] = 0;
	
	var opacityTween = new OpacityTween(this.view,Tween.strongEaseInOut, 0, 100, 1);
	this.opacityTween = opacityTween;
	var self = this;
	this.opacityTween.onMotionStarted = function()
	{
		self.view.style.display = "block";
	}
	this.opacityTween.start();
	
	
	this.opacityTween.onMotionFinished = function()
	{
		self.opacityTween.onMotionFinished = null;
		
		self.tipTween.start();
		self.tipAlphaTween.start();
		JielongCNY.jielongApp.playMouseOver();
				
		setTimeout(function()
		{
			self.notFirst = true;
			if(self.hidden)
			{
				if(self.opacityTween.reverse)
					self.opacityTween.start();
				else
					self.opacityTween.yoyo();
			}
			
			self.opacityTween.onMotionFinished = function()
			{
				self.view.style.display = self.hidden ? "none" : "block";
			}
			
		},2000);
		
		self.view.parentNode.onmousemove = function(event)
		{
			self.checkMouseMove({x:event.pageX,y:event.pageY});
		};
	} 
}

BottomViewController.prototype.checkMouseMove = function(point)
{	
	if(point.x >= JielongCNY.MARGIN && 
	   point.x <= JielongCNY.MARGIN + this.width &&
	   point.y >= this.height - BottomViewController.VIEW_HEIGHT + JielongCNY.MARGIN * 2  &&
	   point.y <= this.height + JielongCNY.MARGIN * 2)
	   {
	   		if(this.hidden)
	   		{
	   			this.hidden = false;
	   				
	   			this.opacityTween.stop();
	   			
	   			if(!this.opacityTween.reverse)
					this.opacityTween.start();
				else
					this.opacityTween.yoyo();
					
				JielongCNY.jielongApp.playMouseOver();
	   		}
	   }else{
	   		if(!this.hidden)
	   		{
	   			this.hidden = true;
	   			
	   			this.opacityTween.stop();
	   			
	   			if(this.opacityTween.reverse)
					this.opacityTween.start();
				else
					this.opacityTween.yoyo();
	   		}
	   }
}

BottomViewController.prototype.hide = function()
{
	this.view.style.display = "none";
}

BottomViewController.prototype.resize = function(width,height)
{
	this.width = width;
	this.height = height;

	//resize container.
	this.view.style.height = BottomViewController.VIEW_HEIGHT + "px";
	this.view.style.left = "0px";
	this.view.style.width = width + "px";
	
	this.view.style.top = height - BottomViewController.VIEW_HEIGHT + JielongCNY.MARGIN + "px";
	this.hidden = true;
	this.view.style['opacity'] = 0;
	this.view.style['-moz-opacity'] = 0;
	if(this.view.filters) this.view.filters.alpha['opacity'] = 0;
	this.view.style.display = this.hidden ? "none" : "block";
	
	if(this.opacityTween)
		this.opacityTween.stop();
	
	var self = this;
	
	//resize background.
	this.bgCanvas.width = width;
	this.bgCanvas.height = BottomViewController.VIEW_HEIGHT;
	
	var context = this.bgCanvas.getContext('2d');
	context.fillStyle = "#000000";
	context.fillRect(0,BottomViewController.VIEW_HEIGHT - BottomViewController.LOW_HEIGHT,width,BottomViewController.VIEW_HEIGHT );
	
	context.strokeStyle = "#6a0007";
	context.lineWidth = 2;
	context.lineCap = "square";
	context.beginPath();
	context.moveTo(width - BottomViewController.RT_WIDTH,0);
	context.lineTo(width - BottomViewController.RB_WIDTH,BottomViewController.VIEW_HEIGHT);
	context.stroke();
	context.closePath();
	
	context.beginPath();
	context.moveTo(width - BottomViewController.RT_WIDTH,0);
	context.lineTo(width - BottomViewController.RB_WIDTH,BottomViewController.VIEW_HEIGHT);
	context.lineTo(width,BottomViewController.VIEW_HEIGHT)
	context.lineTo(width,0);
	context.lineTo(width - BottomViewController.RT_WIDTH,0);
	context.fill();
	context.closePath();
	
	// position elements.
	this.sendBox.style.left = (width - BottomViewController.RT_WIDTH) + "px";
	this.sendBox.style.top = "0px";
	
	this.sendTip.style.left = width - BottomViewController.RT_WIDTH - 8 + "px";
}

var FriendsView = function(){};

FriendsView.prototype.view = null;
FriendsView.prototype.greeting = null;

FriendsView.prototype.initialize = function()
{
	this.view = document.createElement("div");
	this.view.style.position = "absolute";
	this.view.style.width = "437px";
	this.view.style.height = "297px";
	this.view.style.background = "url(images/friends_view_bg.jpg) no-repeat left top";
	
	var viewWrap = document.createElement("div");
	viewWrap.style.position = "relative";
	viewWrap.style.width = "437px";
	viewWrap.style.height = "297px";
	this.view.appendChild(viewWrap);
	
	var btnClose = document.createElement("input");
	btnClose.type = "button";
	btnClose.style.border = "0";
	btnClose.style.width = "20px";
	btnClose.style.height = "20px";
	btnClose.style.background = "url(images/btn_close_friend.jpg) no-repeat";
	btnClose.style.position = "absolute";
	btnClose.style.left = "410px";
	btnClose.style.top = "7px";
	viewWrap.appendChild(btnClose);
	
	btnClose.onclick = function()
	{
		JielongCNY.jielongApp.removePopup();
	}
	
	var iframe = document.createElement("iframe");
	iframe.src = "friends_selection.html";
	iframe.width = 370;
	iframe.height = 161;
	iframe.style.position = "absolute";
	iframe.style.left = "27px";
	iframe.style.top = "65px";
	iframe.style.border = "0";
	iframe.frameBorder = "0";
	viewWrap.appendChild(iframe);
	
	var btnConfirm = document.createElement("input");
	btnConfirm.type = "button";
	btnConfirm.style.border = "0";
	btnConfirm.style.width = "87px";
	btnConfirm.style.height = "29px";
	btnConfirm.style.background = "url(images/btn_confirm.jpg) no-repeat";
	btnConfirm.style.position = "absolute";
	btnConfirm.style.left = "175px";
	btnConfirm.style.top = "250px";
	viewWrap.appendChild(btnConfirm);
	
	var self = this;
	btnConfirm.onclick = function()
	{
		if(iframe.contentWindow == null)
			return;
		if(iframe.contentWindow.FriendsView == null)
			return;
		if(iframe.contentWindow.FriendsView.selectedFriendItems.length <= 0)
		{
			alert("请选择至少一个好友。");
			return;
		}
		
		var friends = [];
		for(var i = 0;i < iframe.contentWindow.FriendsView.selectedFriendItems.length;i++)
			friends.push(iframe.contentWindow.FriendsView.selectedFriendItems[i]["friend"]);
		
		JielongCNY.jielongApp.removePopup();
		JielongCNY.jielongApp.sendGreeting(friends,self.greeting);
	}
}

var SendView = function(friends,greeting)
{
	this.friends = friends;
	this.greeting = greeting;

	this.view = document.createElement("div");
	this.view.style.position = "absolute";
	this.view.style.width = "392px";
	this.view.style.height = "133px";
	this.view.style.background = "#000000";
	this.view.style.border = "#CE0000 1px solid";
	
	var container = document.createElement("div");
	container.style.position = "relative";
	container.style.width = "392px";
	container.style.height = "133px";
	this.view.appendChild(container);
	
	var shareForm = document.createElement("form");
	container.appendChild(shareForm);
	
	var textArea = document.createElement("textArea");
	textArea.style.width = "354px";
	textArea.style.height = "53px";
	textArea.style.position = "absolute";
	textArea.style.left = "12px";
	textArea.style.top = "14px";
	textArea.style.background = "#ce0000";
	textArea.style.fontFamily = FontManager.getNormalFont();
	textArea.style.fontSize = "12px";
	textArea.style.letterSpacing = "1px";
	textArea.style.padding = "8px 6px 8px 6px";
	textArea.style.lineHeight = "18px";
	textArea.style.color = "#FFFFFF";
	textArea.style.resize = "none";
	textArea.style.border = "0";
	textArea.rows = 4;
	
	var friendsNameCount = 0;
	for(var i = 0;i < friends.length;i++)
		friendsNameCount += friends[i]["name"].length + 1;
	
	textArea.maxLength = 140 - SendView.GREATWORKS.length - friendsNameCount - window.location.href.length + window.location.hash.length - 11;
	
	var shareCopy = SendView.SHARE_COPY[Math.floor(SendView.SHARE_COPY.length * Math.random())];
	textArea.value = shareCopy;
	shareForm.appendChild(textArea);
	
	var checkbox = new CustomCheckBox(17,17,"images/check_box.jpg");
	checkbox.view.style.left = "13px";
	checkbox.view.style.top = "96px";
	shareForm.appendChild(checkbox.view);
	checkbox.setChecked(true);
	
	var followCopy = document.createElement("span");
	followCopy.style.position = "absolute";
	followCopy.style.left = "38px";
	followCopy.style.top = "99px";
	followCopy.style.color = "#ce0000";
	followCopy.style.fontSize = "12px";
	followCopy.style.fontFamily = FontManager.getNormalFont();
	followCopy.style.letterSpacing = "1px";
	followCopy.innerHTML = "同时关注GREATWORKS中國";
	shareForm.appendChild(followCopy);
	
	var loading = document.createElement("img");
	loading.src = "images/loading.gif";
	loading.width = 16;
	loading.height = 16;
	loading.style.position = "absolute";
	loading.style.top = "100px";
	loading.style.left = "248px";
	shareForm.appendChild(loading);
	loading.style.display = "none";
	this.loading = loading;
	
	var btnSubmit = document.createElement("input");
	btnSubmit.type = "submit";
	btnSubmit.value = "";
	btnSubmit.style.border = "0";
	btnSubmit.style.background = "url(images/btn_share.jpg)";
	btnSubmit.style.width = "112px";
	btnSubmit.style.height = "29px";
	btnSubmit.style.position = "absolute";
	btnSubmit.style.left = "267px";
	btnSubmit.style.top = "93px";
	shareForm.appendChild(btnSubmit);
	
	var self = this;
	shareForm.onsubmit = function()
	{
		if(self.sending)
			return false;
	
		if(textArea.value.length <= 0)
		{
			alert("请填要分享的内容！");
			textArea.focus();
			return false;
		}
		
		var receiversID = [];
		var receiversName = [];
		for(var i = 0;i < self.friends.length;i++)
		{
			receiversID.push(friends[i]["uid"]);
			receiversName.push(friends[i]["name"]);
		}
		
		self.sending = true;
		self.loading.style.display = "block";
		
		$.post(JielongCNY.backendURL + "send_greeting.php",
		  {receivers_id:receiversID.join(","),
		  receivers_name:receiversName.join(","),
		  need_follow:checkbox.checked ? "yes" : "no",
		  share_copy:textArea.value,
		  content:ChineseConvertor.convertToTraditional(self.greeting)},
		  function(data){self.onGreeingSent(data);},
		  "json");
	
		return false;
	}
}

SendView.prototype.onGreeingSent = function(data)
{
	JielongCNY.jielongApp.removePopup();
	
	if(data["error"] != 0)
	{
		alert(data["error_msg"]);
		window.location.reload();
		return;
	}
	
	var successView = new SendSuccessView;
	JielongCNY.jielongApp.popup(successView.view);
}

SendView.GREATWORKS = "GreatWorks中国";
SendView.SHARE_COPY = ["真心话不去大冒险，去接龙啦！中国人都是龙的传人！当然要接龙过大年！",
					  "大家好！我是龙，12年见一次不容易啊！今年让我们玩点儿新花样，大家来用html5说说老祖宗的吉祥话！",
					  "说了太久的火星文，有多久没用成语了？微博可以控，老祖宗传了几千年的成语更要控！龙的传人，一起来接龍，欢喜过大年！"];

SendView.prototype.loading = null;
SendView.prototype.friends = null;
SendView.prototype.greeting = null;
SendView.prototype.view = null;
SendView.prototype.sending = false;

var SendSuccessView = function()
{
	this.view = document.createElement("img");
	this.view.src = "images/send_success.jpg";
	this.view.style.position = "absolute";
	this.view.style.width = "417px";
	this.view.style.height = "113px";
	
	setTimeout(function(){JielongCNY.jielongApp.removePopup()},3000);
}

SendSuccessView.prototype.view = null;

var CustomCheckBox = function(width,height,bg)
{
	this.width = width;
	this.height = height;
	this.bg = bg;

	this.view = document.createElement("div");
	this.view.style.position = "absolute";
	this.view.style.width = width + "px";
	this.view.style.height = height + "px";

	this.setChecked(false);
	
	var self = this;
	this.view.onclick = function()
	{
		self.setChecked (!self.checked);
	}
}

CustomCheckBox.prototype.view = null;
CustomCheckBox.prototype.checked = false;

CustomCheckBox.prototype.width = 0;
CustomCheckBox.prototype.height = 0;
CustomCheckBox.prototype.bg = null;

CustomCheckBox.prototype.onchange = null;

CustomCheckBox.prototype.setChecked = function(checked)
{
	this.checked = checked;
	if(checked)
		this.view.style.background = "url(" + this.bg +") no-repeat left top";
	else
		this.view.style.background = "url(" + this.bg +") no-repeat right top";
}

var LoginView = function(greeting)
{
	this.greeting = greeting;
	
	var iframe = document.createElement("iframe");
	iframe.src = "api/login.php";
	iframe.width = 600;
	iframe.height = 355;
	iframe.style.position = "absolute";
	iframe.style.border = "0";
	iframe.frameBorder = "0";
	
	this.view = iframe;
}

LoginView.prototype.greeting = null;


var SearchView = function (senderName,width,height)
{
	var view = document.createElement("div");
	view.style.width = width + "px";
	view.style.height = height + "px";
	view.style.position = "absolute";
	view.style.background = "#CE0000";
	this.view = view;
	
	var container = document.createElement("div");
	this.container = container;
	container.style.width = width + "px";
	container.style.height = height + "px";
	container.style.position = "relative";
	view.appendChild(container);
	
	var closeButton = document.createElement("input");
	closeButton.type = "button";
	closeButton.style.width = "44px";
	closeButton.style.height = "44px";
	closeButton.style.background = "url(images/close_search_view.jpg) no-repeat";
	closeButton.style.border = "0";
	closeButton.style.position = "absolute";
	closeButton.style.top = "20px";
	container.appendChild(closeButton);
	this.closeButton = closeButton;
	closeButton.onclick = function(){JielongCNY.jielongApp.removePopup();};
	
		
	var searchTip = document.createElement("div");
	this.searchTip = searchTip;
	searchTip.style.position = "absolute";
	searchTip.style.top = "110px";
	searchTip.style.width = "168px";
	searchTip.style.height = "44px";
	searchTip.style.background = "url(images/search_tip_bg.jpg) no-repeat left top";
	searchTip.style.display = "none";
	container.appendChild(searchTip);
	
	var tipSpan = document.createElement("div");
	tipSpan.innerHTML = "抱歉！你的好友貌似沒來過";
	tipSpan.style.display = "block";
	tipSpan.style.width = "161px";
	tipSpan.style.height = "28px";
	tipSpan.style.fontSize = "12px";
	tipSpan.style.fontFamily = FontManager.getNormalFont();
	tipSpan.style.lineHeight = "28px";
	tipSpan.style.paddingLeft = "5px";
	tipSpan.style.color = "#CE0000";
	tipSpan.style.background = "#000000"
	tipSpan.style.marginLeft = "7px";
	searchTip.appendChild(tipSpan);
	
	var searchForm = document.createElement("form");
	container.appendChild(searchForm);
	
	var txtSearch = document.createElement("input");
	txtSearch.type = "text";
	txtSearch.style.paddingLeft = "5px";
	txtSearch.style.width = "134px";
	txtSearch.style.height = "20px";
	txtSearch.style.background = "#000000";
	txtSearch.style.border = "0";
	txtSearch.style.position = "absolute";
	txtSearch.style.top = "140px";
	txtSearch.style.fontSize = "12px";
	txtSearch.style.fontFamily = FontManager.getNormalFont();
	txtSearch.style.letterSpacing = "1px";
	txtSearch.style.color = "#FFFFFF";
	txtSearch.maxLength = 30;
	txtSearch.value = senderName;
	this.txtSearch = txtSearch;
	searchForm.appendChild(txtSearch);
	
	var btnSearch = document.createElement("input");
	btnSearch.type = "submit";
	btnSearch.value = "";
	btnSearch.style.width = "24px";
	btnSearch.style.height = "22px";
	btnSearch.style.border = "0";
	btnSearch.style.background = "url(images/btn_search_2.jpg) no-repeat";
	btnSearch.style.position = "absolute";
	btnSearch.style.top = "140px";
	this.btnSearch = btnSearch;
	searchForm.appendChild(btnSearch);
	
	var loading = document.createElement("img");
	loading.src = "images/loading.gif";
	loading.width = 16;
	loading.height = 16;
	loading.style.position = "absolute";
	loading.style.top = "143px";
	loading.style.display = "none";
	searchForm.appendChild(loading);
	this.loading = loading;
	
	var senderInfo = document.createElement("div");
	senderInfo.style.position = "absolute";
	senderInfo.style.width = "219px";
	senderInfo.style.height = "64px";
	senderInfo.style.left = "38px";
	senderInfo.style.top = "118px";
	senderInfo.style.background = "url(images/userinfo_bg.jpg) no-repeat left top";
	this.senderInfo = senderInfo;
	container.appendChild(senderInfo);
	senderInfo.style.display = "none";
	
	var senderWrap = document.createElement("div");
	senderWrap.style.position = "relative";
	senderWrap.style.width = "210px";
	senderWrap.style.height = "52px";
	senderWrap.style.marginLeft = "9px";
	senderWrap.style.background = "#000000";
	senderInfo.appendChild(senderWrap);
	
	var userPhoto = document.createElement("img");
	userPhoto.width = 50;
	userPhoto.height = 50;
	userPhoto.style.position = "absolute";
	userPhoto.style.left = "0px";
	userPhoto.style.top = "1px";
	senderWrap.appendChild(userPhoto);
	this.userPhoto = userPhoto;
	
	var txtUsername = document.createElement("span");
	txtUsername.style.color = "#ce0000";
	txtUsername.style.fontWeight = "bold";
	txtUsername.style.fontSize = "12px";
	txtUsername.style.fontFamily = "'STHeiti','黑体','STSong','宋体','STKaiti','楷体'";
	txtUsername.style.letterSpacing = "1px";
	txtUsername.style.position = "absolute";
	txtUsername.style.left = "56px";
	txtUsername.style.top = "9px";
	senderWrap.appendChild(txtUsername);
	this.txtUsername = txtUsername;
	
	var greetingCount = document.createElement("span");
	greetingCount.style.color = "#737373";
	greetingCount.style.fontSize = "12px";
	greetingCount.style.fontFamily = "'STHeiti','黑体','STSong','宋体','STKaiti','楷体'";
	greetingCount.style.letterSpacing = "1px";
	greetingCount.style.position = "absolute";
	greetingCount.style.left = "56px";
	greetingCount.style.top = "26px";
	senderWrap.appendChild(greetingCount);
	this.greetingCount = greetingCount;
	
	this.resize(width,height);
	
	var self = this;
	searchForm.onsubmit = function()
	{
		if(txtSearch.value.length <= 0)
		{
			alert("请输入要查询的好友昵称！");
			txtSearch.focus();
			return false;
		}
		
		setTimeout(function(){self.searchGreeting(txtSearch.value)},50);
		return false;
	}
	
	searchForm.onsubmit();
}

SearchView.prototype.searchGreeting = function(senderName)
{
	this.loading.style.display = "block";
	this.searchTip.style.display = "none";
	this.senderInfo.style.display = "none";
	
	if(this.greetingItems != null && this.greetingItems.length > 0)
	{
		for(var i = 0;i < this.greetingItems.length;i++)
			this.container.removeChild(this.greetingItems[i].view);
	}
	
	this.greetingItems = [];
	
	if(this.pageNumContainer != null)
		this.container.removeChild(this.pageNumContainer);
	this.pageNumContainer = null;
	
	var self = this;
	
	$.get(JielongCNY.backendURL + "search_greeting.php",
		  {friend_name:senderName},
		  function(data){self.searchComplete(data)},
		  "json");
}

SearchView.prototype.searchComplete = function(data)
{
	this.loading.style.display = "none";
	
	if(data["error"] == null || data["error"] == 0)
	{
		if(data.length != null && data.length > 0)
		{
			this.greetings = data;
			this.showUserInfo(data[0]["sender_name"],data[0]["sender_photo"],data.length);
			this.currentPage = 0;
			this.showGreetins();
		}else{
			this.searchTip.style.display = "block";
		}
	}else{
		alert(data["error_msg"]);
	}
}

SearchView.prototype.showGreetins = function()
{
	if(this.greetingItems != null && this.greetingItems.length > 0)
	{
		for(var i = 0;i < this.greetingItems.length;i++)
			this.container.removeChild(this.greetingItems[i].view);
	}
	
	this.greetingItems = [];
	
	if(this.pageNumContainer != null)
		this.container.removeChild(this.pageNumContainer);
	this.pageNumContainer = null;		
	
	var count = 0;
	var self = this;
	for(var i = this.currentPage * SearchView.PAGE_SIZE; count < SearchView.PAGE_SIZE && i < this.greetings.length;i++)
	{
		var greetingItem = 	new GreetingItem(SearchView.ITEM_SIZE,SearchView.ITEM_SIZE,this.greetings[i]["content"]);
		greetingItem.view.style.position = "absolute";
		greetingItem.view.style.background = "#ce0000";
		greetingItem.view.style.border = "#000000 1px solid";
		greetingItem.view.style.left = SearchView.MARIN + (SearchView.ITEM_SIZE + this.spacing) * (i % SearchView.PAGE_SIZE) + "px";
		greetingItem.view.style.top = SearchView.TOP_MARGIN + "px";
		greetingItem.objGreeting = this.greetings[i];
		greetingItem.onclick = function(target)
		{
			JielongCNY.jielongApp.showGreeting(target.objGreeting,target.matrixIndex);
		}
		
		this.container.appendChild(greetingItem.view);
		this.greetingItems.push(greetingItem);
		count ++;
	}
	
	this.pageNumContainer = document.createElement("div");
	this.pageNumContainer.style.position = "absolute";
	this.pageNumContainer.style.width = "120px";
	this.pageNumContainer.style.height = "34px";
	this.pageNumContainer.style.left = (this.width - 120) / 2 + "px";
	this.pageNumContainer.style.top = "430px";
	this.container.appendChild(this.pageNumContainer);
	
	var pageNumWrap = document.createElement("div");
	pageNumWrap.style.position = "relative";
	pageNumWrap.style.width = "120px";
	pageNumWrap.style.height = "34px";
	this.pageNumContainer.appendChild(pageNumWrap);
	
	if(this.currentPage > 0)
	{
		var btnPrev = document.createElement("input");
		btnPrev.type = "button";
		btnPrev.style.width = "37px";
		btnPrev.style.height = "34px";
		btnPrev.style.border = "0";
		btnPrev.style.background = "url(images/btn_prev.jpg) no-repeat left top";
		btnPrev.style.position = "absolute";
		btnPrev.style.left = "0px";
		btnPrev.style.top = "0px";
		pageNumWrap.appendChild(btnPrev);
		
		var self = this;
		btnPrev.onclick = function()
		{
			self.currentPage --;
			self.showGreetins();
		}
	}
	
	if(this.currentPage < Math.ceil(this.greetings.length / SearchView.PAGE_SIZE) - 1)
	{
		var btnNext = document.createElement("input");
		btnNext.type = "button";
		btnNext.style.width = "37px";
		btnNext.style.height = "34px";
		btnNext.style.border = "0";
		btnNext.style.background = "url(images/btn_next.jpg) no-repeat left top";
		btnNext.style.position = "absolute";
		btnNext.style.left = "83px";
		btnNext.style.top = "0px";
		pageNumWrap.appendChild(btnNext);
		
		var self = this;
		btnNext.onclick = function()
		{
			self.currentPage ++;
			self.showGreetins();
		}
	}
}

SearchView.prototype.showUserInfo = function(name,photo,count)
{
	this.senderInfo.style.display = "block";
	
	this.userPhoto.src = photo;
	this.txtUsername.innerHTML = name;
	this.greetingCount.innerHTML = "TA一共发了" + count + "条祝福";
}

SearchView.prototype.resize = function(width,height)
{
	this.width = width;
	this.height = height;
	
	this.view.style.width = width + "px";
	this.view.style.height = height + "px";
	this.container.style.width = width + "px";
	this.container.style.height = height + "px";
	
	this.closeButton.style.left = width - 64 + "px";
	this.txtSearch.style.left = width - 187 + "px";
	this.btnSearch.style.left = width - 46 + "px";
	this.loading.style.left = width - 210 + "px";
	this.searchTip.style.left = width - 195 + "px";
	
	this.spacing = (width - SearchView.MARIN * 2 - SearchView.ITEM_SIZE * SearchView.PAGE_SIZE) / 3;
	
	if(this.greetingItems != null && this.greetingItems.length > 0)
	{
		for(var i in this.greetingItems)
			this.greetingItems[i].view.style.left = SearchView.MARIN + (SearchView.ITEM_SIZE + this.spacing) * (i % SearchView.PAGE_SIZE) + "px";
		
	}
	
	if(this.pageNumContainer != null)
		this.pageNumContainer.style.left = (width - 120) / 2 + "px";
}

SearchView.PAGE_SIZE = 4;
SearchView.ITEM_SIZE = 215;
SearchView.MARIN = 38;
SearchView.TOP_MARGIN = 185;

SearchView.prototype.spacing = 0;
SearchView.prototype.width = 0;
SearchView.prototype.height = 0;
SearchView.prototype.view = null;

SearchView.prototype.pageNumContainer = null;
SearchView.prototype.greetingItems = null;
SearchView.prototype.currentPage = 0;
SearchView.prototype.searchTip = null;
SearchView.prototype.greetings = null;
SearchView.prototype.userPhoto = null;
SearchView.prototype.txtUsername = null;
SearchView.prototype.greetingCount = null;
SearchView.prototype.senderInfo = null;
SearchView.prototype.loading = null;
SearchView.prototype.btnSearch = null;
SearchView.prototype.txtSearch = null;
SearchView.prototype.closeButton = null;
SearchView.prototype.container = null;


var GreetingItem = function(width,height,greeting,matrixIndex,hasBG)
{
	this.hasBG = Boolean(hasBG);
	
	if(matrixIndex == null)
		matrixIndex = Math.floor(GreetingItem.MATRIXES.length * Math.random());
	this.matrixIndex = matrixIndex;

	this.view = document.createElement("div");
	this.view.style.width = width + "px";
	this.view.style.height = height + "px";
	
	if(this.hasBG)
	{
		var bgContainer = document.createElement("div");
		bgContainer.style.width = width + "px";
		bgContainer.style.height = height + "px";
		bgContainer.style.position = "absolute";
		bgContainer.style.left = "0px";
		bgContainer.style.top = "0px";
		this.view.appendChild(bgContainer);
	}
	
	var container = document.createElement("div");
	container.style.width = width + "px";
	container.style.height = height + "px";
	container.style.position = "relative";
	this.view.appendChild(container);
	
	var scaleX = width / 100;
	var scaleY = height / 100;

	var matrixList = GreetingItem.MATRIXES[matrixIndex];
	for(var i = 0;i < greeting.length;i++)
	{
		var canvas = document.createElement("canvas");
		canvas.width = width;
		canvas.height = height;
		canvas.style.position = "absolute";
		canvas.style.left = "0px";
		canvas.style.top = "0px";
		container.appendChild(canvas);
		
		var context = canvas.getContext("2d");
		var matrix = matrixList[i];
		context.transform(matrix.a,matrix.b,matrix.c,matrix.d,matrix.tx * scaleX,matrix.ty * scaleY);
		context.transform(scaleX,0,0,scaleY,0,0);
		
		if(this.hasBG)
		{
			
			var bgCanvas = document.createElement("canvas");
			bgCanvas.width = width;
			bgCanvas.height = height;
			bgCanvas.style.position = "absolute";
			bgCanvas.style.left = "0px";
			bgCanvas.style.top = "0px";
			bgContainer.appendChild(bgCanvas);
			
			var bgContext = bgCanvas.getContext("2d");
			bgContext.transform(matrix.a,matrix.b,matrix.c,matrix.d,matrix.tx * scaleX,matrix.ty * scaleY);
			bgContext.transform(scaleX,0,0,scaleY,0,0);
		
			bgContext.fillStyle = "#ce0000";
			bgContext.fillRect(0,0,50,50);
			
		}
		context.font = GreetingItem.FONT_PATTERN ;
		context.textBaseline = "top";
		context.textAlign = "left";
		context.fillText(greeting.charAt(i),0,0);
	}
	
	var self = this;
	this.view.onclick  = function()
	{
		if(self.onclick != null)
		{
			self.onclick(self);
		}
	}
}


GreetingItem.FONT_PATTERN = FontManager.getFillFont(50);
GreetingItem.MATRIXES = [[{a:0.63751220703125,b:0,c:0,d:0.63751220703125,tx:22.85,ty:-1.75},
						  {a:0.9178924560546875,b:0,c:0,d:0.9178924560546875,tx:50.55,ty:9.3},
						  {a:1.2009124755859375,b:0,c:0,d:1.2009124755859375,tx:-0.45,ty:24.95},
						  {a:0.9188232421875,b:0,c:0,d:0.9188232421875,tx:51.7,ty:49.9}],
						  [{a:1.296356201171875,b:0,c:0,d:1.296356201171875,tx:2.05,ty:-5.2},
						   {a:0.493438720703125,b:0,c:0,d:0.493438720703125,tx:65,ty:32.35},
						   {a:0.7272796630859375,b:0,c:0,d:0.7272796630859375,tx:36.55,ty:56.45},
						   {a:0.651031494140625,b:0,c:0,d:0.651031494140625,tx:70,ty:64.65}],
						   [{a:1.1694793701171875,b:0,c:0,d:1.1694793701171875,tx:1.45,ty:-5.2},
							{a:0.7965087890625,b:0,c:0,d:0.7965087890625,tx:55.85,ty:11.05},
							{a:0.9186859130859375,b:0,c:0,d:0.9186859130859375,tx:19.05,ty:51.5},
							{a:0.5350341796875,b:0,c:0,d:0.5350341796875,tx:62.85,ty:49.2}],
						   [{a:0.4967498779296875,b:0,c:0,d:0.4967498779296875,tx:17.65,ty:18.65},
							{a:0.9420013427734375,b:0,c:0,d:0.9420013427734375,tx:42.15,ty:0.2},
							{a:1.0939178466796875,b:0,c:0,d:1.0939178466796875,tx:4.3,ty:42.35},
							{a:0.673736572265625,b:0,c:0,d:0.673736572265625,tx:57.75,ty:46.85}]];
GreetingItem.prototype.view = null;
GreetingItem.prototype.matrixIndex = -1;
GreetingItem.prototype.objGreeting = null;
GreetingItem.prototype.onclick = null;
GreetingItem.prototype.hasBG = false;

GreetingItem.BACKGROUND_IMAGES = ['images/custom_bg_1.png',
								  'images/custom_bg_2.png',
								  'images/custom_bg_3.png',
								  'images/custom_bg_4.png'];

var GreetingView = function(greeting,matrixIndex,width,height)
{
	this.greeting = greeting;
	matrixIndex = matrixIndex != null ? matrixIndex : Math.floor(Math.random() * GreetingItem.MATRIXES.length);
	this.matrixIndex = matrixIndex;
	
	this.view = document.createElement('div');
	this.view.style.position = "absolute";
	this.view.style.width = width + "px";
	this.view.style.height = height + "px";
	//this.view.style.background ="#ce0000";
	this.view.style.overflow = "hidden";
	
	this.background = document.createElement("div");
	this.background.style.position = "absolute";
	this.background.style.width = width + "px";
	this.background.style.height = height + "px";
	this.background.style.background = "#ce0000";
	this.view.appendChild(this.background);

	this.imageBG = document.createElement("img");
	this.imageBG.src = GreetingItem.BACKGROUND_IMAGES[Math.floor(Math.random() * GreetingItem.BACKGROUND_IMAGES.length)];
	this.background.appendChild(this.imageBG);	
	
	var container = document.createElement('div');
	container.style.position = "relative";
	container.style.width = width + "px";
	container.style.height = height + "px";
	container.style.overflow = "hidden";
	this.view.appendChild(container);
	this.container = container;
	
	var closeButton = document.createElement("input");
	closeButton.type = "button";
	closeButton.style.width = "44px";
	closeButton.style.height = "44px";
	closeButton.style.background = "url(images/close_search_view.jpg) no-repeat";
	closeButton.style.border = "0";
	closeButton.style.position = "absolute";
	closeButton.style.top = "20px";
	container.appendChild(closeButton);
	this.closeButton = closeButton;
	closeButton.onclick = function(){JielongCNY.jielongApp.removePopup();};
	
	var userInfo = document.createElement("div");
	this.userInfo = userInfo;
	this.userInfo.style.zIndex = "5";
	this.userInfo.style.width = "284px";
	this.userInfo.style.height = "141px";
	this.userInfo.style.position = "absolute";
	this.userInfo.style.left = width - 350 + "px";
	this.userInfo.style.top = "98px";
	this.userInfo.style.background = "url(images/right_edge_greeting.png) no-repeat left top";
	container.appendChild(this.userInfo);
	
	var userWrap = document.createElement("div");
	userWrap.style.position = "relative";
	userWrap.style.marginLeft = "17px";
	userWrap.style.width = "267px";
	userWrap.style.height = "110px";
	userWrap.style.background = "#000000";
	userInfo.appendChild(userWrap);
	
	var userPhoto = document.createElement("img");
	userPhoto.src = greeting["sender_photo"];
	userPhoto.width = 64;
	userPhoto.height = 64;
	userPhoto.style.border = "#FFFFFF 1px solid";
	userPhoto.style.position = "absolute";
	userPhoto.style.left = "10px";
	userPhoto.style.top = "10px";
	userWrap.appendChild(userPhoto);
	
	var username = document.createElement("div");
	username.style.position = "absolute";
	username.style.left = "90px";
	username.style.top = "10px";
	username.innerHTML = greeting["sender_name"];
	username.style.color = "#ce0000";
	username.style.fontSize = "14px";
	username.style.fontFamily = "'STHeiti','黑体','STSong','宋体','STKaiti','楷体'";
	username.style.letterSpacing = "1px";
	username.style.fontWeight = "bold";
	userWrap.appendChild(username);
	
	var receiversName = "@ " + greeting["receivers_name"].split(",").join("<br/>@ ");
	var senderName = document.createElement("span");
	senderName.style.position = "absolute";
	senderName.style.left = "90px";
	senderName.style.top = "27px";
	senderName.innerHTML = receiversName;
	senderName.style.color = "#ffffff";
	senderName.style.fontSize = "14px";
	senderName.style.fontFamily = "'STSong','宋体','STHeiti','黑体','STKaiti','楷体'";
	senderName.style.letterSpacing = "1px";
	senderName.style.lineHeight = "16px";
	senderName.style.fontWeight = "bold";
	userWrap.appendChild(senderName);
	
	var bottomTip = document.createElement("div");
	bottomTip.style.position = "absolute";
	bottomTip.style.left = "1px";
	bottomTip.style.top = "84px";
	bottomTip.style.width = "265px";
	bottomTip.style.height = "25px";
	bottomTip.style.background = "#ffffff";
	bottomTip.style.color = "#000000";
	bottomTip.style.fontSize = "13px";
	bottomTip.style.fontFamily = "'STSong','宋体','STHeiti','黑体','STKaiti','楷体'";
	bottomTip.style.letterSpacing = "0px";
	bottomTip.style.lineHeight = "25px";
	bottomTip.style.textAlign = "center";
	bottomTip.innerHTML = "接龍怎麼少得了你？快來寫成語，發祝福吧！";
	userWrap.appendChild(bottomTip);
	
	
	this.resize(width,height);
}

GreetingView.MARGIN_H = 0;
GreetingView.MARGIN_V = -20;

GreetingView.prototype.resize = function (width,height)
{
	this.width = width;
	this.height = height;
	
	this.view.style.width = width + "px";
	this.view.style.height = height + "px";
	
	this.background.style.width = width + "px";
	this.background.style.height = height + "px";
	
	var rate = Math.max(width / 1280,height / 768);
	var imgWidth = 1280 * rate;
	var imgHeight = 768 * rate;
	this.imageBG.width = imgWidth;
	this.imageBG.height = imgHeight;
	this.imageBG.style.marginLeft = (width / 2 - imgWidth / 2) + "px";
	this.imageBG.style.marginRight = (height / 2 - imgHeight / 2) + "px" ;
	
	this.container.style.width = width + "px";
	this.container.style.height = height + "px";
	
	this.closeButton.style.left = width - 64 + "px";
	
	if(this.greetingView != null)
		this.container.removeChild(this.greetingView.view);	
		
	var greetingView = new GreetingItem(height + GreetingView.MARGIN_H,height + GreetingView.MARGIN_V,this.greeting["content"],this.matrixIndex,true);
	greetingView.view.style.position = "absolute";
	greetingView.view.style.left = width / 2 - (284 + height) / 2  -  GreetingView.MARGIN_H / 2 + "px";
	this.userInfo.style.left = width / 2 - (284 + height) / 2 + height + "px";
	greetingView.view.style.top = 0 - GreetingView.MARGIN_V / 2 + "px";
	greetingView.view.style.overflow = "hidden";
	this.container.appendChild(greetingView.view);
	this.greetingView = greetingView;	
	
}

GreetingView.prototype.imageBG = null;

GreetingView.prototype.userInfo = null;
GreetingView.prototype.closeButton = null;
GreetingView.prototype.greetingView = null;
GreetingView.prototype.matrixIndex = -1;
GreetingView.prototype.greeting = null;
GreetingView.prototype.width = 0;
GreetingView.prototype.height = 0;
GreetingView.prototype.view = null;
GreetingView.prototype.container = null;
GreetingView.prototype.background = null;